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 相关文章推荐
弹出广告特效(一个IP只弹出一次)的代码
Jul 27 Javascript
JavaScript函数的4种调用方法详解
Apr 22 Javascript
不到30行JS代码实现Excel表格的方法
Nov 15 Javascript
jQuery中map()方法用法实例
Jan 06 Javascript
JavaScript原生对象之Date对象的属性和方法详解
Mar 13 Javascript
js微信支付实现代码
Dec 22 Javascript
Angular.JS利用ng-disabled属性和ng-model实现禁用button效果
Apr 05 Javascript
jquery实现图片放大点击切换
Jun 06 jQuery
AngularJS解决ng-if中的ng-model值无效的问题
Jun 21 Javascript
简述Angular 5 快速入门
Nov 04 Javascript
jquery拖拽自动排序插件使用方法详解
Jul 20 jQuery
VUE实现Studio管理后台之鼠标拖放改变窗口大小
Mar 04 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
mayfish 数据入库验证代码
2010/04/30 PHP
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
php简单的留言板与回复功能具体实现
2014/02/19 PHP
php导出csv格式数据并将数字转换成文本的思路以及代码分享
2014/06/05 PHP
ThinkPHP防止重复提交表单的方法实例分析
2018/05/10 PHP
js实现的网站首页随机公告随机公告
2007/03/14 Javascript
该如何加载google-analytics(或其他第三方)的JS
2010/05/13 Javascript
js模仿windows桌面图标排列算法具体实现(附图)
2013/06/16 Javascript
JavaScript DOM节点添加示例
2014/07/16 Javascript
js实现按钮颜色渐变动画效果
2015/08/20 Javascript
js鼠标点击按钮切换图片-图片自动切换-点击左右按钮切换特效代码
2015/09/02 Javascript
AngularJS基础 ng-value 指令简单示例
2016/08/03 Javascript
使用nodejs中httpProxy代理时候出现404异常的解决方法
2016/08/15 NodeJs
Vue.js中的图片引用路径的方式
2017/07/28 Javascript
详解vue中axios的封装
2018/07/18 Javascript
Vue使用NProgress的操作过程解析
2019/10/10 Javascript
jQuery实现鼠标移入显示蒙版效果
2020/01/11 jQuery
微信小程序scroll-view实现滚动到锚点左侧导航栏点餐功能(点击种类,滚动到锚点)
2020/06/11 Javascript
JavaScript如何操作css
2020/10/24 Javascript
详解python基础之while循环及if判断
2017/08/24 Python
python 集合 并集、交集 Series list set 转换的实例
2018/05/29 Python
numpy.ndarray 交换多维数组(矩阵)的行/列方法
2018/08/02 Python
python 实现UTC时间加减的方法
2018/12/31 Python
解决Python找不到ssl模块问题 No module named _ssl的方法
2019/04/29 Python
python实现二级登陆菜单及安装过程
2019/06/21 Python
Python3从零开始搭建一个语音对话机器人的实现
2019/08/23 Python
python爬虫中多线程的使用详解
2019/09/23 Python
Python中Flask-RESTful编写API接口(小白入门)
2019/12/11 Python
解决在keras中使用model.save()函数保存模型失败的问题
2020/05/21 Python
豪华复古化妆:Besame Cosmetics
2019/09/06 全球购物
会计主管岗位职责范文
2013/11/08 职场文书
2015年元旦演讲稿
2014/09/12 职场文书
个人收入证明范本
2015/06/12 职场文书
校运会通讯稿
2015/07/18 职场文书
关于五一放假的通知
2015/08/18 职场文书
开发微信小程序之WXSS样式教程
2022/04/18 HTML / CSS