angular.js - angular binds the same event to multiple buttons

Question

I want to use angular to bind the same event to these buttons.
But I don’t want to use this method

Answer 1

Bind ng-click to p in the outer layer and pass in the $event object that comes with angular.

<p ng-click="changeMode($event);">
    <button class="btn btn-primary btn-sm">111</button>
    <button class="btn btn-primary btn-sm">222</button>
    <button class="btn btn-primary btn-sm">333</button>
    <button class="btn btn-primary btn-sm">444</button>
</p>

Controller receives $event. In $event, you can use the target object to determine which button is clicked

$scope.changeMode = function($event){
    $event.target
};

ps: I have two suggestions:
1. Boy, this is the same principle as event delegation. If you don’t have basic js skills, don’t blindly pursue any new framework, just make up for the basics.
2. Teenagers, develop good programming habits. Use button labels for buttons instead of span. Although bootstrap handles all the styling for you, this is a very poor programming habit.

Answer 2

Use uib-btn-radio
http://angular-ui.github.io/b...

Answer 3

NG built-in mini version of jq.

If you don’t use that solution, you can write this pair of codes as a loop. In this redundant code, you can see the corresponding relationship
You can define an object literal:

$scope.types = {
  'primary':'全部时间',
  'success':'最近3天',
  'info':'最近一周',
  'warning':'最近一月',
  'danger':'最近半年'
}

<span ng-repeat="(cla,txt) in types" class="btn btn-sm btn-{{cla}}" ng-click="changeMode()">{{txt}}</span>

Answer 4

What are your needs?