使用AngularJS编写多选按钮选中时触发指定方法的指令

最近在做项目时，遇到了需要用到多选按钮选中触发事件的功能，因此我查找了一下AngularJS的提供的指令，但是没有发现相应的指令。而一个看起来很像的指令就是ng-checked，但是这个指令是用来代替标签里面checked属性的，所以也用不了。因此我就自己动手试着写一个这样的指令，相应的代码如下：

<form name="test_form" ng-controller="TestCtrl">
  <input type="checkbox" name="a" ng-model="a" id="check" ng-checking="say()"/>
  <label for="check">{{ a }}</label>
</form>

var app = angular.module('Demo',[]);
app.directive('ngChecking',function(){
    var fun1 = function(element,attrs){
    return function(scope,iElement,iAttrs){
        scope.$watch('a',function(){
          if(iElement[0].checked){
            if(iAttrs['ngChecking']){           
              var fun = iAttrs['ngChecking'].match(/\w+()/g);
            scope[fun[0]]();
          }
        }
      })
    }
   
  }
    return {
        compile:fun1,
      restrict:'AE'
  }
})
app.controller('TestCtrl',function($scope){
    $scope.say = function(){
      alert(123)
  }
});
angular.bootstrap(document,['Demo']);

亲试可用，AngularJS的功能真的是很强大。

一些AngularJS相关文章链接：

希望你喜欢，并分享我的工作~带你走近AngularJS系列：

1. 带你走近AngularJS - 基本功能介绍 http://www.linuxidc.com/Linux/2014-05/102140.htm
2. 带你走近AngularJS - 体验指令实例 http://www.linuxidc.com/Linux/2014-05/102141.htm
3. 带你走近AngularJS - 创建自定义指令 http://www.linuxidc.com/Linux/2014-05/102142.htm

AngularJS 的详细介绍：请点这里
AngularJS 的下载地址：请点这里