javascript - AngularJS:按分组列表的总和排序

Question

我有不同球队的单场比赛结果列表，格式如下:

    [{team: "A", w: 1, l: 0, t: 0, date: '2018-10-01'},
     {team: "B", w: 1, l: 0, t: 0, date: '2018-10-01'},
     {team: "C", w: 0, l: 1, t: 0, date: '2018-10-01'},
     {team: "D", w: 0, l: 1, t: 0, date: '2018-10-01'},
     {team: "A", w: 1, l: 0, t: 0, date: '2018-10-08'},
     {team: "B", w: 0, l: 1, t: 0, date: '2018-10-08'},
     {team: "C", w: 0, l: 0, t: 1, date: '2018-10-08'},
     {team: "D", w: 0, l: 0, t: 1, date: '2018-10-08'},
     {team: "A", w: 1, l: 0, t: 0, date: '2018-10-15'},
     {team: "D", w: 0, l: 0, t: 0, date: '2018-10-15'},
     {team: "B", w: 1, l: 0, t: 0, date: '2018-10-15'},
     {team: "B", w: 1, l: 0, t: 0, date: '2018-10-17'},
     {team: "B", w: 1, l: 0, t: 0, date: '2018-10-20'},
     {team: "C", w: 0, l: 1, t: 0, date: '2018-10-20'},
     {team: "C", w: 0, l: 1, t: 0, date: '2018-10-22'}]

使用 ng-repeat 和 angular.filter 我现在可以在按团队分组的表格中显示该数据。使用this suggestion我还能够汇总比赛结果以生成每个团队的记录:

Rank    Team    Games   Wins    Losses  Ties
1       A       3       3       0       0
2       D       3       0       1       1
3       C       4       0       3       1
4       B       5       4       1       0

Here is a jsfiddle到目前为止我所得到的。

另外我还有一个datepicker放置在用户可以从中选择日期范围的 View 中。更改这些日期后，聚合就会更新。这也已经在起作用。

我现在的问题是我无法按任何显示的类别对我的 table 进行排序。我尝试了不同的方法，例如使用任何可以想象到的 orderBy: 子句。我还尝试将聚合结果放入一个变量中(例如 {{ Wins = reduce(group, 'w') }})，以便在 orderBy: 中引用，但无济于事。

我想要实现的目标是否可能实现？

Answer 1

一个解决方案是利用您可以将函数作为表达式参数传递到 orderBy 中的事实。在此函数内，您可以计算每个属性的组中所有项目的总和，然后使用结果作为排序依据的值。

对 HTML 的调整:

ng-repeat="group in data | groupBy: 'team' | toArray:true | orderBy:category"

以及相关的 JS 来实现它:

// $scope.order is a user option to specify the property to order by
$scope.category = function (value) {
    // The games column is not a data item property so it is treated specially
    if ($scope.order === 'games') {
        return value.length;
    }
    return value.reduce(function (total, dataItem) {
        return total + dataItem[$scope.order];
    }, 0);
};

And here's forked JSFiddle demonstrating the suggestion.