分组时每列的角度 ng-grid 摘要

【问题标题】：Angular ng-grid summary per column when grouping分组时每列的角度 ng-grid 摘要
【发布时间】：2014-08-07 08:49:13
【问题描述】：

我了解了在对网格here 进行分组时如何自定义 ng-grid 的聚合。
现在 - 如果我的表如下所示，如果我希望在对 groupName 进行分组时显示在 aggregateTemplate 中的每列摘要（value1、value2、value3），该怎么办？

col1;value1;value2;value3;groupName
"first";10;20;30;"group 1"
"second";10;20;30;"group 1"
"third";10;20;30;"group 2"
"fourth";10;20;30;"group 3"
"fifth";10;20;30;"group 3"

当然，我可以在aggregateTemplate 的calculateChildren 函数中一个接一个地执行此操作，但重要的是要对齐列及其摘要。所以基本上我正在寻找的模板是生成相同数量的“单元格”并在该单元格中为每列添加一个摘要。

这是一个示例 plunker：http://plnkr.co/edit/f8patmHudM5PSRyEy6gW?p=preview

【问题讨论】：

标签： javascript angularjs grouping angular-ui ng-grid

【解决方案1】：

我设法通过编写自己的聚合模板找到了解决方案。模板现在如下所示：

aggregateTemplate: 
"<div onmouseover='mouseOver()'; style='display: inline-block;' ng-click=\"row.toggleExpand()\" ng-style=\"rowStyle(row)\" class=\"ngAggregate\">" +
"    <span style='margin-left: -22px' class=\"ngAggregateText\">" +
"      <div ng-class=col.colIndex() style='display: inline-block' ng-repeat='col in renderedColumns'><span>{{col.index > 1 ? (aggFunc(row,col) | SwedishCurrency) : (col.index == 0 ? '&nbsp;' : row.label)}}</span></div>" +
"     </span>" +
"    <div class=\"{{row.aggClass()}}\"></div>" +
"</div>" +
""

这里是聚合函数

$scope.aggFunc = function(row, col) {
  var total = 0;
  angular.forEach(row.children, function(cropEntry) {
    total += parseFloat(cropEntry.entity[col.field]);
  });

  return total;    
};

我使用以下 ng-repeat 对齐单元格（从上面的模板定义中提取）：

ng-repeat='col in renderedColumns'

【讨论】：