之前做了一周的打酱油测试，其实感觉其实测试也是上辈子折翼的天使。
好长时间没写代码，感觉好多都不会了。
感谢这周没有单休，我能看熬夜看奥运了。我能有时间出去看个电影，我能有时间出去逛个商城，我能有时间在家憋一篇博文，顺便在家加班写项目的东西。
不加班万岁万岁！！！（求领导看到！哈哈）
然后说正题吧！！！
中国队加油！中国队加油！！！
好吧 真的是正题！！！
需求
1 还有个总的checkbox 负责全选和反选
2 当每一项开头都选中checkbox的时候，上面的全选自动选上
3 当全选后，取消其中一项的checkbox,全选取消
实践
我表示刚开始我是不会的！！！
思路1 上网查找demo
然后开始查资料
发现个不错的网上案例like this >demo
感觉非常符合我的需求，但是看到demo。
缺点： 没玩几下就发现无法符合需求2、3。但是貌似1 是可以实现的。
思路2 ng-checked开始查了下checkbox在angularjs里面的用法和ng-checked,发现如果用了ng-checked 目测可以实现
html
<div ng-controller="myController"><label for="flag">全选<input id="flag" type="checkbox" ng-model="select_all" ng-click="selectAll()"></label><ul><li ng-repeat="i in list"><input type="checkbox" ng-model="m[i.id]" ng-checked = "select_one" ng-click="selectOne(m[i.id])"><span>{{i.id}}</span></li></ul></div>
js
var app = angular.module('myApp',[]);app.controller('myController', ['$scope', function ($scope) {$scope.list = [{'id': 101},{'id': 102},{'id': 103},{'id': 104},{'id': 105},{'id': 106},{'id': 107}];$scope.m = [];$scope.checked = [];$scope.selectAll = function () {if($scope.select_all) {$scope.select_one = true;$scope.checked = [];angular.forEach($scope.list, function (i, index) {$scope.checked.push(i.id);$scope.m[i.id] = true;})}else {$scope.select_one = false;$scope.checked = [];$scope.m = [];}console.log($scope.checked);};$scope.selectOne = function (select) {angular.forEach($scope.m , function (i, id) {var index = $scope.checked.indexOf(id);if(i && index === -1) {$scope.checked.push(id);} else if (!i && index !== -1){$scope.checked.splice(index, 1);};});if ($scope.list.length === $scope.checked.length) {$scope.select_all = true;} else {$scope.select_all = false;}console.log($scope.checked);}}]);}]);
缺点 参考not-binding-to-ng-checked-for-checkboxes
大概意思说 如果你用了ng-checked 就是默认它最初定义就是true, 因此就没有必要使用ng-model了。简单说来就是ng-model和ng-checked不需要同时用。
看来是能用ng-click 或者 ng-change了
思路3 给数组里面每一个list 绑定checked 的属性
这个想法也是联想到公司之前的一个大牛的写的一个关于checkbox的指令。
html
<div ng-controller="myController"><label for="flag">全选<input id="flag" type="checkbox" ng-model="select_all" ng-change="selectAll()"></label><ul><li ng-repeat="i in list"><input type="checkbox" ng-model="i.checked" ng-change="selectOne()"><span>{{id}}</span></li></ul></div>
js
var app = angular.module('myApp',[]);app.controller('myController', ['$scope', function ($scope) {$scope.list = [{'id': 101},{'id': 102},{'id': 103},{'id': 104},{'id': 105},{'id': 106},{'id': 107}];$scope.m = [];$scope.checked = [];$scope.selectAll = function () {if($scope.select_all) {$scope.checked = [];angular.forEach($scope.list, function (i) {i.checked = true;$scope.checked.push(i.id);})}else {angular.forEach($scope.list, function (i) {i.checked = false;$scope.checked = [];})}console.log($scope.checked);};$scope.selectOne = function () {angular.forEach($scope.list , function (i) {var index = $scope.checked.indexOf(i.id);if(i.checked && index === -1) {$scope.checked.push(i.id);} else if (!i.checked && index !== -1){$scope.checked.splice(index, 1);};})if ($scope.list.length === $scope.checked.length) {$scope.select_all = true;} else {$scope.select_all = false;}console.log($scope.checked);}}]);
推荐第三种方法！以上
参考
/wohenxion/p/4624218.html/api/ng/directive/ngChecked//07/angularjs-checkbox.html/questions/16601018/angularjs-ng-model-not-binding-to-ng-checked-for-checkboxes
