anglur 的绑定排序

   <script type="text/javascript" src="../js/angular.js" ></script>
     <script>
         var app=angular.module("myApp",[]);
         app.controller("myCtrl",function($scope){
             //自定义数据
             $scope.products=[{
                 id:15,
                 name:"可乐小饼干",
                 num:4,
                 price:2221,
                 dates:"2018/1/5"
             },{
                 id:24,
                 name:"呼呼大辣片",
                 num:9,
                 price:5662,
                 dates:"2018/1/5"
             },{
                 id:35,
                 name:"笑笑糖果果",
                 num:5,
                 price:1236,
                 dates:"2018/1/5"
             },{
                 id:46,
                 name:"馨馨小蛋糕",
                 num:3,
                 price:9635,
                 dates:"2018/1/5"
             },{
                 id:59,
                 name:"爽爽大雪碧",
                 num:5,
                 price:7896,
                 dates:"2018/1/5"
             }];

             //筛选商品

             $scope.search="";
             //排序
             $scope.orderFlag="";
             $scope.orderClumn="id";
             $scope.orderByFun=function(clumn){
                 //排序规则，只要点击，次规则执行，更改排序因素
                 
                 //更改排序列名
                 $scope.orderClumn=clumn;
                 if($scope.orderFlag==""){
                     $scope.orderFlag="-";
                 }else{
                     $scope.orderFlag="";
                 }
             }
             //删除商品
             $scope.delProduct=function(clumn){
                 //定义一个空数组
                 var arr=[];
                 //遍历所有商品，存放获得的商品
                 for(index in $scope.products){
                     //当前商品ID和传过来的ID相等是 ，把当前商品放入空数组中
                     if($scope.products[index].id==clumn){
                         $scope.products.splice(index,1);
                     }
                 }
             }
             //全选 、反选
             $scope.selectAll=false;
             $scope.selectAllFun=function(){
                 if($scope.selectAll){
                     for(index in $scope.products){
                         $scope.products[index].state=true;
                     }
                 }else{
                     for(index in $scope.products){
                         $scope.products[index].state=false;
                     }
                 }
             }
             
             //批量删除
                $scope.deleteSelected = function() {
                    //创建空数组，保存选中项商品
                    var arr = [];
                    //遍历商品列表，判断选中项。
                    for(index in $scope.products) {
                        if($scope.products[index].state) {
                            //把选中项的商品对象，放到空数组中。
                            arr.push($scope.products[index]);
                        }
                    }
                    //遍历中间数组，通过此数组觉得删除的商品。
                    if(arr.length <= 0) {
                        alert("请先选择");
                    } else {
                        if(window.confirm("确定删除吗？")) {
                            for(index1 in arr) {
                                //把中间数组的商品和数据源相对比，如果一样就删除当前商品。
                                for(index2 in $scope.products) {
                                    if(arr[index1] == $scope.products[index2]) {
                                        $scope.products.splice(index2, 1);
                                    }
                                }
                            }
                        }
                    }
                }
                     
             //下拉菜单排序
                $scope.selectOrder = "";
                $scope.selectChange = function(){
                    if($scope.selectOrder == ""){
                        
                    }else if($scope.selectOrder == "price"){
                        $scope.orderFlag = "";
                        $scope.orderClumn = "price";
                    }else{
                        $scope.orderFlag = "-";
                        $scope.orderClumn = "price";
                    }
                }
                //计算总金额
                $scope.all=0;
                $scope.allPrice=function(){
              $scope.all=0;
              for (index  in $scope.products){
                  $scope.all=$scope.products[index].num * $scope.products[index].price+$scope.all;
              }
              return $scope.all;
                }
         });
     </script>
    </head>
    <body ng-app="myApp" ng-controller="myCtrl">
     <center>
         <h2>商品列表</h2>
         <input placeholder="商品名称" ng-model="search"/>
         <select ng-model="selectOrder" ng-change="selectChange()">
        <option value="">--请选择--</option>
        <option value="price">价格升序</option>
        <option value="-price">价格降序</option>
        </select>
        <button ng-click="deleteSelected()">批量删除</button><br />
         <table border="1px solid red" cellpadding="10" cellspacing="0">
             <thead>
                 <tr>
                     <th><input type="checkbox" ng-model="selectAll" ng-click="selectAllFun()"</th>
                     <th ng-click="orderByFun('id')">产品编号</th>
                     <th ng-click="orderByFun('name')">产品名称</th>
                     <th>产品数量</th>
                     <th ng-click="orderByFun('price')">产品价格</th>
                     <th>日期</th>
                     <th>产品小计</th>
                     
                     <th >操作</th>
                 </tr>
             </thead>
             <tbody>
                 <tr ng-repeat="pro in products | filter:{name:search}| orderBy:(orderFlag+orderClumn) ">
                     <td><input type="checkbox" ng-model="pro.state"></td>
                     <td>{{pro.id}}</td>
                     <td>{{pro.name}}</td>
                     <td>{{pro.num}}</td>
                     <td>{{pro.price | currency:"RMB￥"}}</td>
                     <td>{{pro.dates}}</td>
                     <td>{{pro.num * pro.price | currency:"RMB￥"}}</td>
                     <td><button ng-click="delProduct(pro.id)">删除</button></td>
                 </tr>
                 <tr>
                     <td>总金额</td>
                     <td ng-bind="allPrice()"></td>
                 </tr>
             </tbody>
         </table>
     </center>
    </body>