day10

最新推荐文章于 2022-02-21 21:18:13 发布

lsq666888

最新推荐文章于 2022-02-21 21:18:13 发布

阅读量163

点赞数

本文链接：https://blog.csdn.net/lsq666888/article/details/79233133

版权

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <script type="text/javascript" src="js/angular.js" ></script>
       <script>
       var app=angular.module("myApp",[]);
           app.controller("myctr",function($scope){
               i=0;
               $scope.stus=[{
                   id:1,
                   goods:"华为",
                   name:"张三",
                   shouji:13461677520,
                   chengshi:"北京"

               },{
                   id:2,
                   goods:"苹果",
                   name:"李四",
                   shouji:13333333333,
                   chengshi:"上海"



               }];

                  //全选
                 $scope. All=function(){
                for(var i0;i<$scope.stus.length;i++){
                      $scope.stus[i].ck=$scope.flag;
                }

}

   //删除
              $scope.sc=function(i){
              $scope.stus.splice(i,1);
          }

                   //添加
          $scope.add=function(){
              $scope.stus.push({
                    id:3,
                    goods:"vivo",
                    name:"王五",
                    shouji:1333333333,
                    chengshi:"上海"

              })
              }

           // 批量删除
            $scope.del=function(){
                //遍历数组
                for(var i=0;i<$scope.stus.length;i++){
                    if($scope.stus[i].ck){
                        $scope.stus.splice(i,1);
                        i--;
                    }
                }
            }
           })






       </script>
   </head>
   <body ng-app="myApp" ng-controller="myctr">
       <button style="background-color:chartreuse" ng-click="add()">新增订单</button>
           <button style="background-color:chartreuse" ng-click="del()">批量删除</button>
       <table border="1px">
               <tr style="background-color: slategray;">
               <td><input type="checkbox" ng-model="flag" ng-click="All()">
                 <td>ID</td>
                 <td>商品名</td>
                 <td>用户名</td>
                 <td>手机号</td>
                 <td>城市</td>
                 <td>操作</td>


             </tr>
             <tr ng-repeat=" s in stus">

              <td><input type="checkbox" ng-model="s.ck"></td>
               <td>{{s.id}}</td>
                <td>{{s.goods}}</td>
                 <td>{{s.name}}</td>
                 <td>{{s.shouji}}</td>
                  <td>{{s.chengshi}}</td>
                 <td><button ng-click="sc($index)" style="background-color: orange;">删除</button></td>


             </tr>
       </table>
   </body>
</html>