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

话不多说,直接看示例代码

HTML代码

 <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还是false

JS代码

//开始默认为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;
      }
     )
    }
   }

总结

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

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索angularjs
, 排序
, 双击事件
angularjs实现排序
angularjs 双击事件、angularjs双击、angularjs 单击和双击、angularjs排序orderby、angularjs拖拽排序,以便于您获取更多的相关知识。

时间: 2024-10-28 00:56:38

AngularJS轻松实现双击排序的功能_AngularJS的相关文章

基于AngularJS的过滤与排序

程序设计分析 首先,如果要是先查询过滤,就要使用到AngularJS中的 过滤器filter 了. 直接在表达式的后面使用管道命令符 | ,按照下面的写法就可以达到一个过滤的效果: {{ persons | filter:query }} 通过使用filter实现过滤操作,query是查询过滤时输入的字符串. 类似地,使用orderBy就可以实现排序的功能: {{ persons | filter:query | orderBy:order }} 上面的查询以及排序涉及到两个变量,query和o

table中点击表头实现排序的功能示例介绍

 获取上次点击的表头的名称和这次点击的表头的名称做比较,如果两者相同就按原先相反的顺序排列,否则新列升序排列 <a href="javascript:setOrder();">表头名字</a>,页面中获取上次点击的表头的名称和这次点击的表头的名称做比较,如果两者相同就按原先相反的顺序排列,否则新列升序排列,    获取排列顺序的列名及排列顺序以后,传到后台获取相应sql,添加order by 语句,完成排序功能    排序顺序值可在form中存放在隐藏域中,思路

AngularJS入门教程之过滤器用法示例_AngularJS

本文实例讲述了AngularJS过滤器用法.分享给大家供大家参考,具体如下: 在前面几节里我们已经接触过AngularJS的表达式,表达式的作用是向视图中输出字面量或$scope对象中的属性值.在输出之前我们可以通过过滤器来格式化输出的数据. 过滤器的使用非常简单,我们看一下下面的代码: <!DOCTYPE html> <html ng-app> <head lang="en"> <meta charset="UTF-8"&

C++ 语言关于结构体的排序的功能

问题描述 C++ 语言关于结构体的排序的功能 结构体由多个字段构成,要求按照先后次序对字段排序,用C++语言实现,怎么才能简单高效可靠 解决方案 参考:http://blog.csdn.net/lethic/article/details/7781203 解决方案二: GO语言为结构体排序c++ 结构体排序结构体优先队列排序 解决方案三: 根据结构体中的某个字段排序?

table中点击表头实现排序的功能示例介绍_JSP编程

<a href="javascript:setOrder();">表头名字</a>,页面中获取上次点击的表头的名称和这次点击的表头的名称做比较,如果两者相同就按原先相反的顺序排列,否则新列升序排列, 获取排列顺序的列名及排列顺序以后,传到后台获取相应sql,添加order by 语句,完成排序功能 排序顺序值可在form中存放在隐藏域中,思路就是这样. 例如在使用Birt报表工具创建报表需要点击表头的名称排序的功能时,可以再表头名称处增加一个超链接,链接内容为T

javascript-JavaScript鼠标双击进行搜索功能

问题描述 JavaScript鼠标双击进行搜索功能 我想问一下在JavaScript中怎样使用鼠标双击所选中的文字就直接打开网页搜索?还请知情者告解一下 解决方案 http://bbs.csdn.net/topics/390360117 看波波同学的回答 解决方案二: jquery的dblclick 解决方案三: 选中了,你还能点击?在点一次就取消选中了好不好!你可以看看csdn的选中弹出一个菜单,里面点击搜索

AngularJS 让人爱不释手的八种功能_AngularJS

八种AngularJS让人爱不释手的功能分享给大家,供大家参考,具体内容如下 第一 迭代输出之ng-repeat标签 ng-repeat让table ul ol等标签和js里的数组完美结合 <ul> <li ng-repeat="person in persons"> {{person.name}} is {{person.age}} years old. </li> </ul> 你甚至可以指定输出的顺序: <li ng-repea

AngularJS使用指令增强标准表单元素功能_AngularJS

Angular 可使用指令无缝地增强标准表单元素的功能,我们将讨论它的优点,包括: 数据绑定.建立模型属性.验证表单.验证表单后反馈信息.表单指令属性 下面我们通过案例验证他们的用法: 一.双向数据绑定(ng-model)和建立模型属性 <!DOCTYPE> <!-- use module --> <html ng-app="exampleApp"> <head> <title>Angular Directive</ti

AngularJS实现星星等级评分功能_AngularJS

星期六加班,教育后台也要有星级评分等级的需求,醉了--基本知道些怎么做,网上也随便找了找,没什么合意的,毕竟需求不同,也不能完全一样不是.学习之,改之╮(╯▽╰)╭ Directive  angular.module('XXX').directive('stars', stars); function stars() { var directive = { restrict: 'AE', template: '<ul class="rating" ng-mouseleave=&q