你懂得

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="js/angular.min.js"></script>
        <script>
            angular.module("zhao",[]).controller("tro",function($scope){
                $scope.shu=[{name:'YL',age:'21',sex:'男',date:new Date('1998-06-19')},{name:'定西以南',age:'22',sex:'女',date:new Date('1997-08-30')},
                {name:'九十九步',age:'17',sex:'男',date:new Date('2000-08-19')}];
                $scope.pl=function(){
                    for(var i=0;i<$scope.shu.length;i++){
                        if($scope.shu[i].ck){
                            $scope.shu.splice(i,1);
                            i--;
                        }
                    }
                }
                $scope.del=function(i){
                    var t =confirm("确定删除吗");
                    if(t){
                        $scope.shu.splice(i,1);
                    }
                }
                $scope.qx=function(){
                var t=$scope.id;
                for(var i in $scope.shu){
                    $scope.shu[i].ck=t;
                }
                }
                $scope.tj=function(){
                    if($scope.name==undefined || $scope.name<3 || $scope.name>30){
                        alert("用户名错误");
                    }
                    else if($scope.age==undefined){
                        alert("年龄错误");
                    }else{
                    $scope.shu.push({name:$scope.name,age:$scope.age,sex:$scope.sex,date:$scope.date});
                    }
                }
            });
        </script>
    </head>
    <body ng-app="zhao" ng-controller="tro">
        <center>
            <button ng-click="pl()">批量删除</button>
            <table>
                <tr>
                <td>查询:<input type="text" ng-model="test"></td>
            </tr>
            </table>
            <select ng-model="px">
                <option value="-age">年龄降序</option>
                <option value="+age">年龄升序</option>
            </select>
            <form>
                <input ng-model="name" />
                <input ng-model="age" />
                <select ng-model="sex" ng-init="sex='男'">
                    <option>男</option>
                    <option>女</option>
                </select>
                <input ng-model="date"  type="date"/>
                <button ng-click="tj()">添加</button>
            </form>
        <table border="1">
            
            <tr>
                <td><input type="checkbox" ng-model="id" ng-click="qx()"></td>
                <td>姓名</td>
                <td>年龄</td>
                <td>性别</td>
                <td>生日</td>
                <td>操作</td>
            </tr>
            <tr ng-repeat="a in shu|filter:{name:test}|orderBy:px">
                <td><input type="checkbox" ng-model="a.ck"></td>
                <td>{{a.name}}</td>
                <td>{{a.age}}</td>
                <td>{{a.sex}}</td>
                <td>{{a.date|date:"yyyy-MM-dd hh:mm:ss"}}</td>
                <td><button ng-click="del($index)">删除</button></td>
            </tr>
        </table>
        </center>
    </body>
</html>

猜你喜欢

转载自blog.csdn.net/qq_41880248/article/details/79671559