Angular ng-repeat 中的 orderBy 数组项值

IT技术 javascript angularjs
2021-01-25 12:01:59

如何让 Angular 的ng-repeat指令按照每个项目的实际值而不是每个项目的属性值对列表进行排序?

例如:

<ul>
    <li ng-repeat="item in items | orderBy:'WHAT_GOES_HERE??'">{{item}}</li>
</ul>

这是一个可以玩的小提琴:http : //jsbin.com/okatur/1/edit

我意识到我只能.sort()在阵列上,但这是我唯一的选择吗?

2个回答

从 1.3.0-rc.5 开始

AngularJS 1.3.0-rc.5 开始如果没有提供附加参数orderBy过滤器(请参阅文档)将使用其项自动对数组进行排序。

<li ng-repeat="item in items | orderBy">{{item}}</li>

JS Bin

1.3.0-rc.5 之前

所述orderBy过滤器(见历史文档)还可以采取一个函数作为第二个参数,其返回值为将使用进行比较<=>操作者。为此,您可以简单地使用angular.identity(参见文档):

$scope.identity = angular.identity;
<li ng-repeat="item in items | orderBy:identity">{{item}}</li>

JS Bin

酷,谢谢!是否可以angular.identity直接在标记中引用,而不必将其保存到$scope.identityJS 中?
2021-03-17 12:01:59
还值得注意的是,您可以通过使用 orderBy reverse with >1.3.0-rc.5 orderBy:true:true
2021-03-17 12:01:59
@BradenSteffaniak 好吧,不,它不起作用。实际上,从 1.3.0-rc.5 开始,array | orderBy就相当于array | orderBy:'+'. 如果你想以相反的顺序排序,你可以简单地做array | orderBy:'-'尝试使用第一个 JS Bin 链接 ;-) !
2021-03-26 12:01:59
不能。您只能访问$scope模板中定义的变量
2021-03-27 12:01:59

您可以尝试以下。

<ul>
    <li ng-repeat="item in items | orderBy:'toString()'">{{item}}</li>
</ul>