AngularJS - 按键、值对重复 ng 时的 orderBy 值

Joe*_*e82 2 angularjs lodash

我已经用 lodash 中的 countBy 函数计算了一组数据中每个项目的出现次数,结果是这样的:

$scope.colors= {
"Orange": 3,
"Blue": 2,
"Pink": 1,
"Red": 1,
"Black": 2,
};
Run Code Online (Sandbox Code Playgroud)

现在我想显示数据并按其值排序。我试过

<div ng-controller="myCtrl" ng-app="myApp">
    <ul>
      <li ng-repeat="(key,value) in colors | orderBy:value">
        {{key}} ({{value}})
      </li>
    </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

但是 orderBy 过滤器似乎并没有起作用(请参阅此处的 plunkr)

有什么办法可以用当前的数据形式来做,还是有更好的方法来构造数据以达到预期的结果?提前致谢!

JB *_*zet 5

作为 文档所说, orderBy 需要一个数组作为输入,而不是一个对象。一般来说,虽然它受支持,但我从未遇到过使用带有 ng-repeat 的对象是个好主意的用例。

只需将您的对象转换为数组:

$scope.colors = [];
angular.forEach(occurrences, function(value, key) {
    $scope.colors.push({
        color: key,
        count: value
    });
});
Run Code Online (Sandbox Code Playgroud)

然后使用

<li ng-repeat="element in colors | orderBy:'count'">
    {{ element.color }} ({{ element.count }})
</li>
Run Code Online (Sandbox Code Playgroud)

查看您更新的 plunkr。