anglurjs操作单选框传递id以及全选、全不选

anglurjs操作单选框传递id

<td><input type="checkbox" class="eachbox" ng-click="updateSelection($event,entity.id)"></td>

$event：获取当前触发事件的元素，这里获取的是input元素
$event的target属性是给当前元素赋予的类型的属性，即给input赋予checkbox的属性checked
将选中元素的id添加进数组

$scope.selectIds.push(id);

获取元素在数组中的索引

var index = $scope.selectIds.indexOf(id);

从数组中删除元素

$scope.selectIds.splice(index,1);//第一个参数是从哪个索引开始删除，第二个元素是删除几个元素

完整代码

<td><input type="checkbox" class="eachbox" ng-click="updateSelection($event,entity.id)"></td>

$scope.selectIds = [];
$scope.updateSelection = function($event,id){
    //选中
    if ($event.target.checked){
        //把id添加进数组里
        $scope.selectIds.push(id);
    }
    else{//未选中
        //获取元素在数组中的索引
        var index = $scope.selectIds.indexOf(id);
        //从数组中删除元素
        $scope.selectIds.splice(index,1);//第一个参数是从哪个索引开始删除，第二个元素是删除几个元素
    }
}

全选、全不选

页面

 <thead>
 <tr>
    <th class="" style="padding-right:0px">
        <input id="selall" type="checkbox" class="icheckbox_square-blue" ng-click="selectAll($event)">
    </th>
    <th class="sorting_asc">品牌ID</th>
    <th class="sorting">品牌名称</th>
    <th class="sorting">品牌首字母</th>
    <th class="text-center">操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="entity in list">
	<td><input type="checkbox" class="eachbox" ng-click="updateSelection($event,entity.id)"></td>
	<td>{{entity.id}}</td>
	<td>{{entity.name}}</td>
	<td>{{entity.firstChar}}</td>
	<td class="text-center">
		<button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal" ng-click="findOne(entity.id)">修改
		</button>
	</td>
</tr>

js

$scope.selectAll = function($event){
    var state = $event.target.checked;
    //使用jquery语法遍历class为eachbox的单选框，所以页面需要引入jquery
    $(".eachbox").each(function (index,obj) {//参数一是排序序号(索引)，参数二是对象(这里是单选框这个对象)
        obj.checked = state;//使遍历的每个单选框都和全选框的状态保持一致
        //obj是js的原生对象，需要把js对象转换成jquery对象
        //$(obj)把js对象转换成jquery对象
        //$(obj).parent()获取到当前对象的父对象，这里是td
        //$(obj).parent().next()的next()是获取下一个对象（兄弟对象）即下一个td（显示id的td）
        var id = parseInt($(obj).parent().next().text());//将string类型转换成int类型
        if (state){
            $scope.selectIds.push(id);
        }else{
            //获取元素在数组中的索引
            var index = $scope.selectIds.indexOf(id);
            //从数组中删除元素
            $scope.selectIds.splice(index,1);//第一个参数是从哪个索引开始删除，第二个元素是删除几个元素
        }
    })
}