本文介绍了触发所有的复选框事件,而在angularjs选择checkall的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
<表类=表>
<&THEAD GT;
<第i个<输入类型=复选框名称='全选'NG模型=值1NG点击=全选()>< /第i
<第i个名称和LT; /第i
< / THEAD>
< TR NG重复=X中的项目>
< TD><输入类型=复选框NG模型=值2NG-真值=YESNG-假值=NONG点击=选择($事件,x.id )
/>< / TD>
&所述; TD> {{x.name}}&下; / TD>
< / TR>
< / TR>
< /表>
如何,我得到当我点击所有item.id全选()复选框?
另外,您能否提供我要NG重复复选框合适NG-模型语法?
谢谢,
拉贾氏/ P>
解决方案
\r
\r\r
\r VAR的myapp = angular.module('应用',[]);\r
myapp.controller(Ctrl键,功能($范围){\r
VAR VM =这一点;\r
vm.data = {\r
项目:\r
{ID:1,名称:阿里,选择否},\r
{ID:2,名称:礼,选择否},\r
{ID:3,名称:阿米尔,选择否}\r
]\r
};\r
\r
vm.value1 = FALSE;\r
\r
vm.selectAll =功能($事件){\r
VAR复选框= $ event.target;\r
变种选定=否;\r
如果(checkbox.checked)\r
{\r
选=YES;\r
}\r
其他{\r
选=否;\r
}\r
angular.forEach(vm.data.items,函数(项目){\r
item.selected =选择;\r
});\r
\r
\r
\r
\r
}\r
});
\r
&LT;脚本SRC =https://ajax.googleapis.com/ajax /libs/angularjs/1.2.23/angular.min.js\"></script>\r
&LT; DIV NG-应用=应用程序NG控制器=Ctrl键VM&GT;\r
&LT;表类=表&GT;\r
&LT;&THEAD GT;\r
&LT;第i个&LT;输入类型=复选框名称='全选'NG模型=值1NG点击=vm.selectAll($事件)&GT;&LT; /第i\r
&LT;第i个所有&LT; /第i\r
&LT; / THEAD&GT;\r
&LT; TR NG重复=X在vm.data.items&GT;\r
&LT; TD&GT;&LT;输入类型=复选框NG模型=vm.data.items [$指数] .selectedNG-真值=YESNG-假值=NONG-点击=vm.select($事件,x.id)\r
/&GT;&LT; / TD&GT;\r
&所述; TD&GT; {{x.name}}&下; / TD&GT;\r
\r
&LT; / TR&GT;\r
&LT; /表&gt;\r
\r
&LT; / DIV&GT;
\r
<table class="table">
<thead>
<th> <input type='checkbox' name='selectall' ng-model="value1" ng-click="selectAll()"></th>
<th> Name </th>
</thead>
<tr ng-repeat="x in items">
<td><input type='checkbox' ng-model="value2" ng-true-value="YES" ng-false-value="NO" ng-click="select($event,x.id)"
/></td>
<td>{{x.name}}</td>
</tr>
</tr>
</table>
How to I get all the item.id when I click "selectall()" checkbox ?
Also, Can you suggest me appropriate ng-model syntax for ng-repeat checkbox ?
Thanks,Raja K
解决方案
var myapp = angular.module('app', []);
myapp.controller('Ctrl', function ($scope) {
var vm = this;
vm.data = {
items: [
{id:1,name:"ali",selected: "NO"},
{id:2,name:"reza",selected: "NO"},
{id:3,name:"amir",selected: "NO"}
]
};
vm.value1 = false;
vm.selectAll = function($event){
var checkbox = $event.target;
var selected = "NO";
if(checkbox.checked)
{
selected = "YES";
}
else {
selected = "NO";
}
angular.forEach(vm.data.items, function(item) {
item.selected = selected;
});
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="Ctrl as vm">
<table class="table">
<thead>
<th> <input type='checkbox' name='selectall' ng-model="value1" ng-click="vm.selectAll($event)"></th>
<th> All </th>
</thead>
<tr ng-repeat="x in vm.data.items">
<td><input type='checkbox' ng-model="vm.data.items[$index].selected" ng-true-value="YES" ng-false-value="NO" ng-click="vm.select($event,x.id)"
/></td>
<td>{{x.name}}</td>
</tr>
</table>
</div>
这篇关于触发所有的复选框事件,而在angularjs选择checkall的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!