AngularJS：GroupBy然后排序答案

【问题标题】：AngularJS: GroupBy then SortAngularJS：GroupBy然后排序
【发布时间】：2015-07-24 06:58:58
【问题描述】：

我有一个集合并在使用 ng-repeat 在 UI 中显示之前使用 lodash.js groupBy 对其进行分组

    var list = [{id:1,categoryId:1,name:test1},
                {id:2,categoryId:2,name:test2},
                {id:3,categoryId:12,name:test12}]

    vm.myList= _.groupBy(list,function (j) { return j.categoryId; });

    console.debug(vm.myList) // this shows the correct ordering!!!

现在当我使用 ng-repeat 显示它时，它会打乱排序

<div ng-repeat="(categoryId, details) in vm.myList| orderBy: 'categoryId'>
        {{ categoryId }}
</div>

这个显示

1
12
2

如何让它显示

1
2
12

我正在尝试这样的事情，但没有运气

<div ng-repeat="(categoryId, details) in vm.myList| orderBy: 'parseInt(categoryId)'>
            {{ categoryId }}
    </div>

更新！我发现这在 Angular 1.4.x 中不是问题。不幸的是，我们使用的是旧版本 Angular 1.3.x

【问题讨论】：

@elclanrs 仍然没有运气。它将它排序为字符串
@elclanrs：这不是 Angular 的 orderBy 的工作原理
当我console.debug(vm.myList) 的顺序正确，但在ng-repeat 中它会打乱顺序，即使我删除了orderBy
你可以试试orderBy: -'parseInt(categoryId)
vm.myList 是对象吗？如果是这样，那么 orderBy 不能使用对象，并且 ngRepeat - 将键作为字符串并对其进行排序

标签： javascript angularjs underscore.js lodash

【解决方案1】：

首先，orderBy 过滤器仅适用于数组，因此如果您尝试将对象传递给它，将按原样返回传递的对象。

第二个，ngRepeat

您需要注意，JavaScript 规范没有定义为对象返回的键的顺序。（为了在 Angular 1.3 中缓解这种情况，ngRepeat 指令用于按字母顺序对键进行排序。）

1.4 版删除了字母排序。

如果不希望这样做，推荐的解决方法是将对象转换为一个数组，该数组按您喜欢的顺序排序，然后再提供给 ngRepeat。您可以使用 toArrayFilter
之类的过滤器来执行此操作

因此，为了解决您的问题，只需将您的分组对象转换为数组，然后根据需要对其进行排序。

【讨论】：