1、angular文件
app.controller('绑定控制器名称',['$scope',
function($scope){
$scope.checked = [];
$scope.toggleCheck = function(id,$index,event)
{
if(event.target.nodeName != 'INPUT' && event.target.nodeName != 'SPAN')
return;
//判断是否已经选中
var isset = $scope.checked.indexOf(id); //返回首次出现的位置
if(isset === -1)
{
$scope.checked.push(id); //没有选中,则把当前的id放到checked变量里面
}
else{
$scope.checked.splice(isset,1); //选中,则删除checked中的id
$scope.selectAll = false; //置空全选状态
}
//选中的长度是否等于全部数据的长度
if($scope.checked.length == $scope.datas.length)
{
$scope.selectAll = true;
}
else
{
$scope.selectAll = false;
}
}
//全选按钮事件
$scope.checkAll = function(event)
{
event.stopPropagation();//阻止当前事件在DOM树上冒泡
if(event.target.nodeName != 'INPUT' && event.target.nodeName != 'TD' && event.target.nodeName != 'SPAN' && even.target.nodeName != 'STRONG') return;
//清空所有
$scope.checked = [];
$scope.selectAll = !$scope.selectAll;
if($scope.selectAll) //不选中的状态时,遍历追加到到checked数组中
{
angular.forEach($scope.datas,function(item,i)
{
$scope.checked.push(item.id);
}
}
};
]);
2、html文件
<table>
<tr style="font-weight: bold" ng-click="checkAll($event)" class="tr-a">
<td>
<label class="checkbox-inline i-checks">
<input type="checkbox" ng-checked="selectAll"/> <i></i>
<b>全选</b>
</label>
</td>
</tr>
<tr>
<td ng-click="toggleCheck({{id}},$index,$event)">
<label class="checkbox-inline i-checks">
<input type="checkbox" ng-checked="checked.indexOf(data.id) > -1 "><i></i>
</label>
</td>
</tr>
</table>