css - 如何在 AngularJS ui-grid 的分组网格中显示列页脚？

Question

我正在使用 AngularJS ui-grid然后跟着这个tutorial显示网格的列页脚，效果很好。但是，在网格中添加分组功能后，列脚消失了。

在 105_footer 教程中，我使用它来聚合列值:

aggregationType: uiGridConstants.aggregationTypes.SUM

在分组的列定义中，我添加了这个来聚合列值:

treeAggregation: {type: uiGridGroupingConstants.aggregation.SUM}

Answer 1

问题是列聚合不知道分组，因此它试图盲目地聚合列中的所有可见行。这可能会导致错误的答案。

这里有两种形式的错误:

1. 默认情况下，分组会将标签放入文本中 - 例如，年龄列中的“最大值:30”。聚合则无法聚合。您可以使用 customFinalizerFn 解决此问题，就像我在下面的 plunker 中所做的那样

2. 聚合只是聚合所有可见的行，包括 groupHeader 行。因此，如果您有一个级别的分组然后展开所有级别，则 SUM 聚合最终将是实际值的两倍。如果您有两个级别的分组，它将是三级。

简而言之，我认为将列页脚和列级聚合与分组一起使用可能不是一个好主意。

http://plnkr.co/edit/1znbxELDzeNVK3x3G1c2?p=preview

showGridFooter: true,
showColumnFooter: true,

  { name: 'age', treeAggregationType: uiGridGroupingConstants.aggregation.MAX, aggregationType: uiGridConstants.aggregationTypes.avg, width: '20%', customTreeAggregationFinalizerFn: function( aggregation ){ aggregation.rendered = aggregation.value; } },