使用 orderBy 对 ng-repeat 中的对象数组进行排序答案

【问题标题】：Sorting an array of objects in ng-repeat using orderBy使用 orderBy 对 ng-repeat 中的对象数组进行排序
【发布时间】：2016-06-02 19:51:08
【问题描述】：

我有一个对象数组，我正在尝试使用 angularjs 的 ng-repeat 功能通过布尔对象属性对它们进行排序（或分组）。

我尝试使用 orderBy 和 groupBy 但它们都不起作用。

这是我的html：

<tbody md-body>
                        <tr md-row ng-repeat="item in dashboardCtrl.unAckAlertList | limitTo : 4 | orderBy: 'item.urgent'">
                            <td md-cell>
                                <i ng-if="item.urgent" class="fa fa-warning" style="font-size:22px;color:red;"></i><i ng-if="!item.urgent" class="fa fa-warning" style="font-size:22px;color:slategray;"></i><span><b> {{item.status}}</b></span>
                            </td>
                            <td md-cell>
                                {{item.MyName}} / {{item.sourceProperty}}
                            </td>
                            <td md-cell>
                                {{item.name}}
                            </td>

它从来没有用过，我想知道为什么。

【问题讨论】：

标签： javascript angularjs angularjs-ng-repeat ng-repeat angularjs-orderby

【解决方案1】：

orderBy 在数组的当前元素中查找您告诉它的属性。

在您提供的 sn-p 中，您将当前元素的名称命名为 item，这是 orderBy 将在其中查找属性的名称。

你不需要写orderBy: item.urgent。如果你写orderBy: urgent，Angular 应该可以解决剩下的问题。

【讨论】：

【解决方案2】：

您应该使用以下语法：

orderBy: 'urgent'

这里引用 documentation 关于使用 string 作为 orderBy 参数：

string：一个 Angular 表达式。此表达式的结果用于比较元素（例如 name 以按名为 name 的属性进行排序）...

【讨论】：

是的，我认为这也是问题的一部分，但在对数组进行排序之前将 ng-repeat 限制为 4 会导致实际问题。

【解决方案3】：

两件事导致了这个错误：

数组应该先排序，然后你应该限制视图。
无论您想根据哪个对象属性进行排序，您都应该只输入属性名称，而不是对象本身。

代替：

ng-repeat="item in dashboardCtrl.unAckAlertList | limitTo : 4 | orderBy: 'item.urgent'"

应该是

ng-repeat="item in dashboardCtrl.unAckAlertList | orderBy: 'urgent' | limitTo : 4 "

【讨论】：