如何angular过滤器进行排序???

首先定义一个json文件:

然后写HTML文件:

 1 <div id="box">
 2             <!--第一个下拉框-->
 3             <select ng-model="a">
 4                 <option value="age">按照年龄排序</option>
 5                 <option value="code">按照编码排序</option>
 6                 <option value="name">按照姓名排序</option>
 7             </select>
 8             <!--升序还是降序-->
 9             <select ng-model="b">
10                 <option value="">升序</option>
11                 <option value="-">降序</option>
12             </select>
13             <!--一个搜索框-->
14             <input type="text" placeholder="请输入要搜索的内容" ng-model="c"/>
15         </div>
16         <!--渲染的数据-->
17         <div id="wrap">
18             <table>
19                 <tr>
20                     <th>编码</th>
21                     <th>姓名</th>
22                     <th>年龄</th>
23                 </tr>
24                 <tr ng-repeat="item in data|filter:c|orderBy:b+a">
25                     <td>{{item.code}}</td>
26                     <td>{{item.name}}</td>
27                     <td>{{item.age}}</td>
28                 </tr>
29             </table>
30         </div>
31         

angular:

1 <script>
2             var app = angular.module("mk",[]);
3             app.controller("test",function($scope,$http){
4                 $http.get(‘json/index.json‘).success(function(data){
5                         $scope.data = eval(data);
6                         $scope.a = "code";
7                 })
8             })
9         </script>

在这种运用到的过滤器有filter 、orderBy

这样就完成了一个简单的排序,希望能帮到大家!!!!!!!!

时间: 2024-10-16 15:51:32

如何angular过滤器进行排序???的相关文章

Angular过滤器

angular中的过滤器有: currency 过滤货币 number  过滤数字, date  过滤日期 json 把js对象过滤为json字符串 limitTo  截取字符串,参数是正数则从左往右截取,负数从末尾开始数起,没有0,从1开始 lowercase 把字符串转为小写 uppercase 把字符串转为大写 orderBy  根据给定的对象的属性名对对象进行排序,可以升序也可以降序 参数为 true false $filter  在脚本中写过滤器 .filter 自定义过滤器 <!DO

angular 过滤加排序

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

Angular过滤器 自定义及使用方法

首先设置自定义过滤器. 定义模块名:angular .module('myApp') .filter('filterName',function(){ return function(要过滤的对象,参数1,参数2,...){ return Obj; //这里返回的是过滤后的对象 } }); 页面中的使用 {{obj | filterName}} ====> obj是要过滤的对象 控制器中使用. 首先要要控制器注入$filter $filter("filterName")(要过滤的

简话Angular 04 Angular过滤器详解

一句话: filter是万能的数据处理器,可以过滤数据,排序数据,删除数据,扩展数据 1. 内置filter大全 url: https://docs.angularjs.org/api/ng/filter uppercase lowercase 转换为大小写 date 转换为各种日期格式 number 将数字格式化成文本. 它的第二个参数是可选的, 用来控制小数点后截取的位数 currency 转换为货币形式 json 转换json或javascript对象成字符串 filter 过滤数据,可以

angular过滤器使用 自定义过滤器

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <body ng-app="myApp" ng-contr

ios之过滤器,排序器

NSPredicate(谓词,作为过滤器使用) 过滤器的意思就是在一组数据中通过数组中元素的某个属性的值是多少,从而过滤出数组中这个值为多少的数组元素组.下面通过代码来说明一下吧 NSPredicate *p = [NSPredicate predicateWithFormat: @"selected == YES"]; // 通过selected属性来作为过滤的条件 NSArray *selectedArray = [self.canDetailDataArray filteredA

angular过滤器 -- 截取字符串

使用angular定义用于截取特定长度的过滤器,并使用自定义符号(包括"...")在末尾进行替换 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>stringSub</title> </head> <script src="http://cdn.static

angular 过滤器

angular.module('GR.app', []) .filter( "store",function(){ return function(params){ var spec = params["spec"]; for(var key in spec){ var i = spec[key]["inventory"]; if(i>0){ return true; } } return false; } }) 页面: ng-if=&qu

Angular过滤器基本用法

过滤器主要用于数据的筛选,可以直接在模板使用 语法: {{expression | filter}} {{expression | filter | filter2}} {{expression | filter : param....}} 例子: demo3.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>