angularJs中orderBy筛选以及filter过滤数据的方法


Posted in Javascript onSeptember 30, 2018

如下所示:

<div ng-app="module" ng-controller="ctrl">
 <!--按照click降序排序-->
 {{data|orderBy:'click':true}}<br>

 <!--按照id升序排序-->
 {{data|orderBy:'id':false}}<br>

 <!--筛选匹配3的数据-->
 {{data|filter:'3'}}<br>

 <!--筛选完全匹配‘百度'-->
 {{data|filter:'百度':true}}<br>
</div>
<script>
 var m = angular.module('module', []);
 m.controller('ctrl', ['$scope', function ($scope) {
  $scope.data=[
   {id:1,click:100,title:'百度'},
   {id:2,click:350,title:'谷歌'},
   {id:3,click:300,title:'网易'},
  ];
 }]);
</script>

效果图:

angularJs中orderBy筛选以及filter过滤数据的方法

以上这篇angularJs中orderBy筛选以及filter过滤数据的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
文字溢出实现溢出的部分再放入一个新生成的div中具体代码
May 17 Javascript
JavaScript实现网页上的浮动广告的简单方法
Jun 14 Javascript
jquery 快速回到页首的方法
Dec 05 Javascript
javascript打开word文档的方法
Apr 16 Javascript
Node.js与PHP、Python的字符处理性能对比
Jul 06 Javascript
原生javaScript实现图片延时加载的方法
Dec 22 Javascript
深入探寻javascript定时器
Jan 02 Javascript
jQuery Mobile 触摸事件实例
Jun 04 Javascript
JS根据生日月份和日期计算星座的简单实现方法
Nov 24 Javascript
javascript html5轻松实现拖动功能
Mar 01 Javascript
解决node-sass偶尔安装失败的方法小结
Dec 05 Javascript
原生JS检测CSS3动画是否结束的方法详解
Jan 27 Javascript
jQuery实现点击图标div循环放大缩小功能
Sep 30 #jQuery
angularJs使用ng-repeat遍历后选中某一个的方法
Sep 30 #Javascript
基于VUE实现的九宫格抽奖功能
Sep 30 #Javascript
react native基于FlatList下拉刷新上拉加载实现代码示例
Sep 30 #Javascript
关于AngularJS中ng-repeat不更新视图的解决方法
Sep 30 #Javascript
angular5 子组件监听父组件传入值的变化方法
Sep 30 #Javascript
小程序视频或音频自定义可拖拽进度条的示例代码
Sep 30 #Javascript
You might like
PHP提取字符串中的图片地址[正则表达式]
2011/11/12 PHP
利用ThinkPHP内置的ThinkAjax实现异步传输技术的实现方法
2011/12/19 PHP
php+ajax做仿百度搜索下拉自动提示框(有实例)
2012/08/21 PHP
PHP容易忘记的知识点分享
2013/04/30 PHP
PHP PDOStatement::debugDumpParams讲解
2019/01/30 PHP
编写跨浏览器的javascript代码必备[js多浏览器兼容写法]
2008/10/29 Javascript
jQuery入门第一课 jQuery选择符
2010/03/14 Javascript
深入理解JavaScript系列(13) This? Yes,this!
2012/01/18 Javascript
js数组Array sort方法使用深入分析
2013/02/21 Javascript
javascript放大镜效果的简单实现
2013/12/09 Javascript
如何动态的导入js文件具体该怎么实现
2014/01/14 Javascript
Jquery validation remote 验证的缓存问题解决方法
2014/03/25 Javascript
JavaScript Date对象详解
2016/03/01 Javascript
jquery对dom节点的操作【推荐】
2016/04/15 Javascript
基于Vuejs框架实现翻页组件
2020/06/29 Javascript
ECMAscript 变量作用域总结概括
2017/08/18 Javascript
vue.js实现简单轮播图效果
2017/10/10 Javascript
利用python批量给云主机配置安全组的方法教程
2017/06/21 Python
详解Python 字符串相似性的几种度量方法
2019/08/29 Python
python实现WebSocket服务端过程解析
2019/10/18 Python
Python打开文件、文件读写操作、with方式、文件常用函数实例分析
2020/01/07 Python
移动端html5判断是否滚动到底部并且下拉加载
2019/11/19 HTML / CSS
LEGO玩具英国官方商店:LEGO Shop GB
2018/03/27 全球购物
利物浦足球俱乐部官方商店(美国):Liverpool FC US
2019/10/09 全球购物
斯洛伐克电子产品购物网站:DATART
2020/04/05 全球购物
Jowissa官方网站:瑞士制造的手表,优雅简约的设计
2020/07/29 全球购物
乌克兰巴士票购买网站:inBus
2021/03/12 全球购物
一套中级Java程序员笔试题
2015/01/14 面试题
绩效工资分配方案
2014/01/18 职场文书
给校长的建议书400字
2014/05/15 职场文书
小学领导班子对照材料
2014/08/23 职场文书
小学秋季运动会报道稿
2014/09/30 职场文书
工作收入住址证明
2014/10/28 职场文书
Mysql基础之常见函数
2021/04/22 MySQL
Python还能这么玩之用Python做个小游戏的外挂
2021/06/04 Python
PHP获取学生成绩的方法
2021/11/17 PHP