当前位置： 移动技术网 > IT编程>脚本编程>AngularJs > 使用AngularJS编写多选按钮选中时触发指定方法的指令代码详解

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

2017年12月12日  | 移动技术网IT编程  | 我要评论

摩登妮,希爱力双效片,引用帅男

最近在做项目时，遇到了需要用到多选按钮选中触发事件的功能，因此我查找了一下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编写多选按钮选中时触发指定方法的指令代码详解，希望对大家有所帮助

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网