html5中文学习网

您的位置: 首页 > 网站及特效实例 > javascript特效 » 正文

AngularJS轻松实现双击排序的功能_AngularJS_

[ ] 已经帮助:人解决问题

话不多说,直接看示例代码iYQHTML5中文学习网 - HTML5先行者学习网

HTML代码iYQHTML5中文学习网 - HTML5先行者学习网

 <th class="col-md-3"><a href="" ng-click="desc('2',la=!la)">单价</a></th> <th class="col-md-3"><a href="" ng-click="desc('3',la=!la)">销售金额</a></th> <th class="col-md-1"><a href="" ng-click="desc('4',la=!la)">销售数量</a></th>

其中 la=!la 是用来判断当前点击是true还是falseiYQHTML5中文学习网 - HTML5先行者学习网

JS代码iYQHTML5中文学习网 - HTML5先行者学习网

//开始默认为totalnum字段 按照降序排列$scope.foodsale =ret.sort(function ( x,y )    {     return y.totalnum - x.totalnum;//这样表示 按照ret【表示接收返回数组】里面的totalnum字段 按照降序排列 反之 return x.totalnum - y.totalnum; 为升序})   $scope.desc= function (fla,bol) {   if(fla=="4"){    if(bol==false){          $scope.foodsale =$scope.foodsale.sort(function ( x,y )     {      return y.totalnum - x.totalnum;     })    }else{     console.log("bbb")     $scope.foodsale =$scope.foodsale.sort(function ( x,y )     {      return x.totalnum - y.totalnum;     })    }   }else if(fla=="3"){//totalmoney    if(bol==false){     $scope.foodsale =$scope.foodsale.sort(function ( x,y )     {      return y.totalmoney - x.totalmoney;     })    }else{     $scope.foodsale =$scope.foodsale.sort(function ( x,y )      {       return x.totalmoney - y.totalmoney;      }     )    }   }else if(fla=="2"){//price    if(bol==false){     $scope.foodsale =$scope.foodsale.sort(function ( x,y )     {      return y.price - x.price;     })    }else{     $scope.foodsale =$scope.foodsale.sort(function ( x,y )      {       return x.price - y.price;      }     )    }   }

总结iYQHTML5中文学习网 - HTML5先行者学习网

好了,以上就是AngularJS实现双击排序功能的全部内容,通过以上示例代码便可实现双击排序,希望对大家学习AngularJS能有所帮助。iYQHTML5中文学习网 - HTML5先行者学习网

(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助