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

 更新时间:2018年09月30日 10:32:35   作者:泠泠在路上  
今天小编就为大家分享一篇angularJs中orderBy筛选以及filter过滤数据的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

如下所示:

<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筛选

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

相关文章

  • 详解AngularJS ng-class样式切换

    详解AngularJS ng-class样式切换

    本篇文章主要介绍了详解AngularJS ng-class样式切换,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • 在 Angular 中使用Chart.js 和 ng2-charts的示例代码

    在 Angular 中使用Chart.js 和 ng2-charts的示例代码

    本篇文章主要介绍了在 Angular 中使用Chart.js 和 ng2-charts的示例代码,具有一定的参考价值,有兴趣的可以了解一下
    2017-08-08
  • 在Angular中实现一个级联效果的下拉框的示例代码

    在Angular中实现一个级联效果的下拉框的示例代码

    这篇文章主要介绍了在Angular中实现一个级联效果的下拉框的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-05-05
  • angular4中*ngFor不能对返回来的对象进行循环的解决方法

    angular4中*ngFor不能对返回来的对象进行循环的解决方法

    今天小编就为大家分享一篇angular4中*ngFor不能对返回来的对象进行循环的解决方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • Angular中$compile源码分析

    Angular中$compile源码分析

    本文给大家分享的是通过angular中的$compile源码进行分析,从而更好的理解angular的使用,非常的不错,希望大家能够喜欢。
    2016-01-01
  • angularJs的ng-class切换class

    angularJs的ng-class切换class

    这篇文章主要介绍了angularJs的ng-class切换class,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • angularJs使用ng-repeat遍历后选中某一个的方法

    angularJs使用ng-repeat遍历后选中某一个的方法

    今天小编就为大家分享一篇angularJs使用ng-repeat遍历后选中某一个的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • Angular 4.x 动态创建表单实例

    Angular 4.x 动态创建表单实例

    本篇文章主要介绍了Angular 4.x 动态创建表单实例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-04-04
  • angularjs学习笔记之双向数据绑定

    angularjs学习笔记之双向数据绑定

    AngularJS在$scope变量中使用脏值检查来实现了数据双向绑定。和Ember.js数据双向绑定中动态设施setter和getter不同,脏治检查允许AngularJS监视那些存在或者不存在的变量。
    2015-09-09
  • Angular8路由守卫原理和使用方法

    Angular8路由守卫原理和使用方法

    这篇文章主要给大家介绍了关于Angular8路由守卫原理和使用方法的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用Angular8具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-08-08

最新评论