批量删除

来源：互联网发布：php小例子编辑：程序博客网时间：2024/06/05 21:57
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <style>        table{            border-collapse: collapse;        }        th,td{            padding: 10px;            border: 1px solid #000;        }    </style>    <script src="angular-1.5.5/angular.min.js"></script>    <script>        var myapp=angular.module("myapp",[]);        myapp.controller("myCtrl",function($scope){            $scope.data=[{                "name":"三星",                "price":"3000",                "has":true,                "check":false            },{                "name":"huawei",                "price":"3000",                "has":true,                "check":false            },{                "name":"苹果",                "price":"6000",                "has":true,                "check":false            },{                "name":"小米",                "price":"2000",                "has":true,                "check":false            }];            //删除            $scope.del=function(index){                console.log(index);                $scope.data.splice(index,1);            };            //全选            $scope.checkAll=false;            $scope.check2=function(){                if($scope.checkAll==true){                    for(var i=0;i<$scope.data.length;i++){                        $scope.data[i].check=true;                    }                }else{                    for(var i=0;i<$scope.data.length;i++){                        $scope.data[i].check=false;                    }                }            };            //反着全选            var n=0;            $scope.count=function(index){                //console.log(index);                if($scope.data[index].check==true){                    n++;                }else{                    n--                }                console.log(n);                if(n==$scope.data.length){                    $scope.checkAll=true;                }else{                    $scope.checkAll=false;                }            };            //批量删除的方法            $scope.delAll=function(){                for(var i=0;i<$scope.data.length;i++){                    if($scope.data[i].check==true){                        $scope.data.splice(i,1);                        i--;                    }                }            }        })    </script></head><body ng-app="myapp" ng-controller="myCtrl">    <table>        <thead>        <tr>            <th>序号</th>            <th><input type="checkbox" ng-model="checkAll" ng-click="check2()">全选</th>            <th>品牌</th>            <th>价格</th>            <th>是否有货</th>            <th>操作<button ng-click="delAll()">批量删除</button></th>        </tr>        </thead>        <tbody>        <tr ng-repeat="item in data">            <td>{{$index}}</td>            <td><input type="checkbox" ng-model="item.check" ng-click="count($index)"></td>            <td>{{item.name}}</td>            <td>{{item.price}}</td>            <td>{{item.has}}</td>            <td><button ng-click="del($index)">删除</button></td>        </tr>        </tbody>    </table></body></html>
阅读全文
0 0