使用AngularJS编写多选按钮选中时触发指定方法的指令代码详解
程序员文章站
2022-04-29 08:34:15
最近在做项目时,遇到了需要用到多选按钮选中触发事件的功能,因此我查找了一下angularjs的提供的指令,但是没有发现相应的指令。而一个看起来很像的指令就是ng-check...
最近在做项目时,遇到了需要用到多选按钮选中触发事件的功能,因此我查找了一下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的键盘事件的绑定