AngularJS orderBy
过滤器
定义和用法
orderBy
过滤器允许我们对数组进行排序。
默认情况下,字符串按字母顺序排序,数字按数字排序。
语法
{{ array | orderBy :
expression :
reverse }}
参数值
值 | 描述 |
---|---|
expression | 用于确定顺序的表达式。表达式的类型可以是:
String 字符串: 如果数组是一个对象数组,则可以根据其中一个对象属性的值对数组进行排序。见下面的例子。 Function 函数: 您可以创建一个函数来组织排序。 Array 数组: 如果需要多个对象属性来确定排序顺序,请使用数组。数组项既可以是字符串,也可以是函数。 |
reverse | 可选。如果要反转数组的顺序,请将其设置为 true。 |
更多实例
实例
按 "city" 对数组排序:
<div ng-app="myApp" ng-controller="orderCtrl">
<ul>
<li ng-repeat="x
in customers | orderBy : 'city'">{{x.name + ", " + x.city}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('orderCtrl', function($scope) {
$scope.customers
= [
{"name" : "Bottom-Dollar
Marketse" ,"city" : "Tsawassen"},
{"name" : "Alfreds Futterkiste", "city" : "Berlin"},
{"name" : "Bon app", "city" : "Marseille"},
{"name" : "Cactus Comidas para llevar", "city" : "Buenos Aires"},
{"name" : "Bolido Comidas preparadas", "city" : "Madrid"},
{"name" : "Around the Horn", "city" : "London"},
{"name" : "B's Beverages", "city" : "London"}
];
});
</script>
亲自试一试 »
实例
按 "city" 对数组进行降序排序:
<div ng-app="myApp" ng-controller="orderCtrl">
<ul>
<li ng-repeat="x
in customers | orderBy : '-city'">{{x.name + ", " + x.city}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('orderCtrl', function($scope) {
$scope.customers
= [
{"name" : "Bottom-Dollar
Marketse" ,"city" : "Tsawassen"},
{"name" : "Alfreds Futterkiste", "city" : "Berlin"},
{"name" : "Bon app", "city" : "Marseille"},
{"name" : "Cactus Comidas para llevar", "city" : "Buenos Aires"},
{"name" : "Bolido Comidas preparadas", "city" : "Madrid"},
{"name" : "Around the Horn", "city" : "London"},
{"name" : "B's Beverages", "city" : "London"}
];
});
</script>
亲自试一试 »
相关页面
AngularJS 教程: Angular Filters