因吹死厅



<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <script src="js/angular.min.js"></script>
 <script>
  angular.module("list",[]).controller("con",function($scope,$http){
    $http.get("http://result.eolinker.com/rR1VBtT56a6bb220c10b3d44b65b4787a8aec03c4ec32ce?uri=ThirdTest").success(function(a){
     $scope.datas=a;
     
    })
    $scope.del=function(a){
     $scope.datas.splice(a,1);
     
    }
    $scope.id=false;
    $scope.qx=function(){
     $scope.id=!$scope.id;
     for (var i in $scope.datas) {
      $scope.datas[i].ck=!$scope.datas[i].ck;
     }
     
    }
    $scope.sum=function(){
     var id=0;
     for (var i=0;i<$scope.datas.length;i++) {
      
       id=id+($scope.datas[i].price*$scope.datas[i].number);
       
      
      
     }
     return id;
    }
    $scope.delAll=function(){
     for (var i=0;i<$scope.datas.length;i++) {
      if($scope.datas[i].ck){
       $scope.datas.splice(i,1);i--;
      }
     }
     
     
    }
   
  })
  
  
 </script>
 <body ng-app="list" ng-controller="con">
  <center>
   <h1 ng-if="datas.length==0">我的购物车</h1>
   <input type="button" value="全选/全不选" ng-click="qx()" />
   <input type="button" value="清空购物车" ng-click="delAll()" />
  <table border="1" cellspacing="0" width="600" ng-if="datas.length!=0">
    <tr>
     <th></th>
     <th>编号</th>
     <th>名称</th>
     <th>价格</th>
     <th>数量</th>
     <th>小计</th>
     <th>操作</th>
    </tr>
    <tr ng-repeat="i in datas">
     <th><input type="checkbox" ng-model="i.ck"></th>
     <th>{{i.id}}</th>
     <th>{{i.name}}</th>
     <th>{{i.price | currency:'¥:'}}</th>
     <th>
      <button ng-click="i.number=i.number+1">+</button>
      <input type="text" ng-model="i.number" style="width: 30px;" min="1">
     <button ng-click="i.number=i.number-1">-</button>
     </th>
     <th>{{i.price*i.number}}</th>
     <th><button ng-click="del($index)">删除</button></th>
    </tr>
    <tr>
    <th colspan="7">总价为:{{sum() | currency:'¥:'}}</th>
   
     </tr>
  </table>
  
  </center>
 </body>
</html>

猜你喜欢

转载自blog.csdn.net/oooooooooop/article/details/79804553