search

Home  >  Q&A  >  body text

angular.js - angular给多个button绑定同一个事件


想用angular 给这几个button 绑定同一个事件。
但是不想用这样的方法

漂亮男人漂亮男人2744 days ago751

reply all(4)I'll reply

  • 世界只因有你

    世界只因有你2017-05-15 17:14:48

    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.

    reply
    0
  • 淡淡烟草味

    淡淡烟草味2017-05-15 17:14:48

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

    reply
    0
  • 阿神

    阿神2017-05-15 17:14:48

    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>

    reply
    0
  • PHPz

    PHPz2017-05-15 17:14:48

    What are your needs?

    reply
    0
  • Cancelreply