在Angular ng-repeat中按照数组项的值排序

Question

如何使 Angular 的 ng-repeat 指令按照每个项目的实际值而非每个项目属性的值来排序？

例如：

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

这里有一个可以玩耍的示例: http://jsbin.com/okatur/1/edit

我知道我可以在数组上使用.sort(), 但这是我的唯一选择吗？

- tuff

---

所以你想按照<code>{{item}}</code>中的任何内容进行排序？ - John Woodruff

是的，没错 - $scope.items 是一个原始类型数组。 - tuff

Answer 1

自 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

- Blackhole

---

很酷，谢谢！在标记中是否可以直接引用angular.identity，而不必在JS中将其保存到$scope.identity中？ - tuff

不可以在模板中访问未在 $scope 中定义的变量。 - Blackhole

值得注意的是，您可以使用orderBy:true:true在>1.3.0-rc.5中进行反向排序。 - Braden Steffaniak

@BradenSteffaniak 嗯，不，它不起作用。实际上，自从1.3.0-rc.5以来，array | orderBy等同于array | orderBy:'+'。如果您想按相反的顺序排序，因此您只需执行array | orderBy:'-'即可。在第一个JS Bin链接中尝试一下吧；-)！ - Blackhole

Answer 2

您可以尝试以下操作。

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

- Rahul Jujarey