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 相关文章推荐
ExtJS 2.0实用简明教程 之Border区域布局
Apr 29 Javascript
jQuery的实现原理的模拟代码 -2 数据部分
Aug 01 Javascript
javascript中[]和{}对象使用介绍
Mar 20 Javascript
JS如何判断是否为ie浏览器的方法(包括IE10、IE11在内)
Dec 13 Javascript
bootstrap datetimepicker日期插件使用方法
Jan 13 Javascript
JS身份证信息验证正则表达式
Jun 12 Javascript
vue如何获取点击事件源的方法
Aug 10 Javascript
VUE 全局变量的几种实现方式
Aug 22 Javascript
Vuex新手的理解与使用详解
May 31 Javascript
vue实现鼠标经过动画
Oct 16 Javascript
js实现适配移动端的拖动效果
Jan 13 Javascript
关于angular浏览器兼容性问题的解决方案
Jul 26 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详细彻底学习Smarty
2008/03/27 PHP
php 需要掌握的东西 不做浮躁的人
2009/12/28 PHP
PHP迅雷、快车、旋风下载专用链转换代码
2010/06/15 PHP
深入php之规范编程命名小结
2013/05/15 PHP
PHP 实现代码复用的一个方法 traits新特性
2015/02/22 PHP
php生成短域名函数
2015/03/23 PHP
ThinkPHP表单数据智能写入create方法实例分析
2015/09/27 PHP
Yii2前后台分离及migrate使用(七)
2016/05/04 PHP
PHP实现数据库统计时间戳按天分组输出数据的方法
2017/10/10 PHP
asp(javascript)全角半角转换代码 dbc2sbc
2009/08/06 Javascript
利用js实现选项卡的特别效果的实例
2013/03/03 Javascript
JS输入用户名自动显示邮箱后缀列表的方法
2015/01/27 Javascript
浅谈jQuery中setInterval()方法
2015/07/07 Javascript
jQuery Mobile 和 Kendo UI 的比较
2016/05/05 Javascript
jQuery实现微信长按识别二维码功能
2016/08/26 Javascript
基于Vue2.0+ElementUI实现表格翻页功能
2017/10/23 Javascript
详解基于vue-cli优化的webpack配置
2017/11/06 Javascript
vue select二级联动第二级默认选中第一个option值的实例
2018/01/10 Javascript
详解微信小程序的 request 封装示例
2018/08/21 Javascript
layui 数据表格 点击分页按钮 监听事件的实例
2019/09/02 Javascript
Vue分页插件的前后端配置与使用
2019/10/09 Javascript
Pyspider中给爬虫伪造随机请求头的实例
2018/05/07 Python
python opencv实现图像边缘检测
2019/04/29 Python
最小二乘法及其python实现详解
2020/02/24 Python
Python2手动安装更新pip过程实例解析
2020/07/16 Python
CSS3实现瀑布流布局与无限加载图片相册的实例代码
2016/12/22 HTML / CSS
组织关系转移介绍信
2014/01/16 职场文书
交通事故调解协议书
2014/04/16 职场文书
文艺演出策划方案
2014/06/07 职场文书
建筑管理专业求职信
2014/07/28 职场文书
2014年祖国生日寄语
2014/09/19 职场文书
2014年公司工作总结
2014/11/22 职场文书
世界环境日活动总结
2015/02/11 职场文书
毕业班班主任工作总结2015
2015/07/23 职场文书
优秀新员工事迹材料
2019/05/13 职场文书
Mysql官方性能测试工具mysqlslap的使用简介
2021/05/21 MySQL