2

我的数据包含的字段比我的页面包含的列多。我需要将字段汇总到列中。

我拥有的 JSON：

{
  'foo1' : 10,
  'foo2' : 11,
  'foo3' : 5,
  'bar1' : 23,
  'bar2' : 2,
  'baz1' : 53,
  'baz2' : 43
},{
  'foo1' : 11,
  'foo2' : 41,
  'foo3' : 31,
  etc.
}

我想要的网格：

Foos Bars Baz's
---- ---- -----
 26   23   96
 83  etc.

所以我希望能够在渲染字段之前添加多个项目，如下所示：

columnDefs: [{
  field: 'foo1 + foo2 + foo3',
  displayName: 'Foos' 
},{
  field: 'bar1 + bar2',
  displayName: 'Bars' 
},{
  field: 'baz1 + baz2',
  displayName: 'Baz's' 
}]

或者类似的东西

field : 'sumFields([foo1,foo2,foo3])'
...
$scope.sumFields = function(fieldlist){
  return fieldlist.reduce(function(pv, cv) { return pv + cv; }, 0));
};

当然，这些伪代码都不起作用。

而且我想避免为每一列编写自定义 CellTemplate。

我想，在最坏的情况下，我可以在渲染之前对数据进行处理......所以，

{
  'foo1' : 10,
  'foo2' : 11,
  'foo3' : 5,
  'bar1' : 23,
  'bar2' : 2,
  'baz1' : 53,
  'baz2' : 43,

  'foos': 26,
  'bars': 23,
  'bazs': 96
},{
  'foo1' : 11,
  'foo2' : 41,
  'foo3' : 31,
  etc.
}

[编辑]我添加了一个示例 plunker，其中包含我未修改的网格，以及我想要的描述：

http://plnkr.co/edit/x5abGuyvunBDes6h60eg?p=preview

我不想看到猫或狗或其他动物，我想看到某些类型的总和。这些列比我展示的要多，所以我正在寻找一个更通用的解决方案，比如

  numAnimalsByType([arrayOfAnimals])

所以我可以这样做：

field: numAnimalsByType([dog,cat])
field: numAnimalsByType([fish,snail])
4

1 回答 1

0

已接受的挑战！

columnDefs所以我只是对你的字段值做了一个小改动：

  $scope.columnDefs = [{
    field: 'it.foo1 + it.foo2 + it.foo3',
    displayName: 'Foos'
  }, {
    field: 'it.bar1 + it.bar2',
    displayName: 'Bars'
  }, {
    field: 'it.baz1 + it.baz2',
    displayName: "Baz's"
  }];

附加项的目的it.是使其成为一个公式，因此我们可以评估它们：

<table>
  <tr>
    <th ng-repeat="column in columnDefs">{{column.displayName}}</th>
  </tr>
  <tr ng-repeat="it in entries">
    <td ng-repeat="column in columnDefs">{{$eval(column.field)}}</td>
  </tr>
</table>

而已！简单而实用，看看它在这里工作：

http://plnkr.co/edit/DfRiqH18MpnFPa0jL2X6?p=preview

希望有帮助。

于 2014-08-16T00:16:07.637 回答