Angularjs ng网格理货多列

我的数据包含的字段比我的页面包含的列多。我需要将字段和列相加

我所拥有的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));
};

  numAnimalsByType([arrayOfAnimals])

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

我希望避免为每一列编写自定义的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.
}

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

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

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

  numAnimalsByType([arrayOfAnimals])

所以我可以这样做：

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

接受挑战

因此，我只是对您的

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>

{{column.displayName}}
{{$eval（column.field）}

就这样！简单实用，请参见此处：

---

希望对您有所帮助。

想发布您的网格html吗？更好的是，用小提琴来显示你的问题。我已经修改了帖子，加入了一个plunker。谢谢。虽然我使用的是ng grid，所以没有HTML可修改，但它都是由插件生成的。我必须修改源代码。在这种情况下，我认为没有其他选择，只能将数组转换为一个新的数组，所有的计算都已经完成，在一个更简单的数组中并绑定到它。好的，我将继续。在渲染之前，我只需创建并添加所需的新字段。report.landlife=report.cats+report.dogs；也许有人会想出一个更优雅的方式。