angular.js 购物车

来源：互联网发布：java计算n的阶乘编辑：程序博客网时间：2024/05/21 11:04

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title>week</title>
       <script type="text/javascript" src="js/angular.js" ></script>
        <script>
           var app = angular.module("myapp",[]);
                app.controller("myctrl",function($scope){
                        $scope.goods = [
                        {"id":80,"name":"iphone","price":5400,},
                        {"id":1200,"name":"ipad mini","price":2200,},
                        {"id":500,"name":"ipad air","price":2340,},
                        {"id":29,"name":"ipad","price":1420,},
                        {"id":910,"name":"imac","price":15400,}
                        ];

                        //
                        $scope.bold = "bold";
                        $scope.title = 'name';
                        $scope.desc = 0;
                        $scope.key = '';

                        //删除
                        $scope.deletes =function(name){

                           var p;
                           for( index in    $scope.goods){
                               p = $scope.goods[index];
                               if( p.name == name){
                                   $scope.goods.splice(index,1);
                               }

                           }

                        };
                        $scope.delall =function(){
                           //alert("sasd");
                           $scope.goods.splice($scope.goods);
                        };

                         $scope.togg =function(tit){
                           $scope.title = tit;
                             $scope.desc = !$scope.desc;
                        };
                });
        </script>
   </head>
   <body ng-app="myapp" ng-controller="myctrl">
       <center>
       <table cellpadding="10" cellspacing="0" border="1">
           <tr>
              <th><input class="form-control" type="text" ng-model="key" placeholder="请输入产品名称关键字"/></th>
              <th colspan="3" align="left" ng-click="delall()">全部删除</th>
           </tr>
           <tr >
              <th ng-click="togg('id')" ng-click="ss()">产品编号▼</th>
              <th ng-click="togg('name')">产品名称▼</th>
              <th ng-click="togg('price')">产品价格▼</th>
              <th>删除</th>
           </tr>
              <tr ng-repeat="x in goods | filter: {name: key} | orderBy: title : desc">
              <td>{{x.id}}</td>
              <td>{{x.name}}</td>
              <td>{{x.price | currency:"(RMB)"}}</td>
              <td><span ng-click="deletes(x.name)">删除</span></td>
           </tr>
       </table>
       </center>
   </body>
</html>

阅读全文

0 0