全选批量删除

来源：互联网发布：手机网络被劫持怎么办编辑：程序博客网时间：2024/06/10 22:48

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>全选、批量删除</title>

<script src="js/angular.min.js"></script>

<script>
angular.module("myapp", []).controller("kongzhiqi", function($scope) {

$scope.users = [
{state:false,name: "洋葱",price: 2,num: 2},
{state:false,name: "大葱",price: 4,num: 12},
{state:false,name: "胡萝卜",price: 1,num: 2},
{state:false,name: "牛肉",price: 50,num: 12},
{state:false,name: "胡萝卜1",price: 1,num: 2},
{state:false,name: "牛肉1",price: 50,num: 12}
];

$scope.del=function(){
for(var i=0;i<$scope.users.length;i++){
if($scope.users[i].state){
$scope.users.splice(i,1);
i--; //让下个值从删除的索引开始
}
}
}
//全选的操作
$scope.ckAll=function(){
for(var i in $scope.users){
$scope.users[i].state=$scope.ckall;
}
}
})
</script>

</head>
<body ng-app="myapp" ng-controller="kongzhiqi">

<button ng-click="del()">批量删除</button>

<table border="1px" width="500px">
<tr>
<th>
<input type="checkbox" ng-model="ckall" ng-click="ckAll()" /> 全选/全不选
</th>
<th>商品名称 </th>
<th>商品价格</th>
<th>商品数量</th>
</tr>
<tr ng-repeat="u in users|filter:{name:selname,num:selnum}|orderBy: ord:isjia">

<td><input type="checkbox" ng-model="u.state" /> </td>
<td>{{u.name}}</td>
<td>{{u.price}}</td>
<td>{{u.num}}</td>
</tr>
</table>

</body>
</html>

阅读全文

0 0

全选 批量删除

全选批量删除