1

在我应用一个按对象的名称值过滤它们的管道过滤器之后，我希望在我的 json 对象中显示数量值的总和。到目前为止，我可以通过它们的 .json 对象的名称值过滤数字，但是我无法在管道中使用 .reduce() 方法找到并显示总和。

如何显示我的管道按名称值过滤的金额总数？

最终，我希望用户搜索一个城市并查看每个对象的数值的总和，该数值可通过相同的城市名称识别。
（我正在构建本教程https://www.youtube.com/watch?v=sVTNaYBVP88&list=PL4cUxeGkcC9jqhk5RvBiEwHMKSUXPyng0&index=22）

json样本

[
{
"name": "Bacon",
"belt": "purple",
"amount": 23
},
{
"name": "Alex",
"belt": "purple",
"amount": 24
},
{
"name": "Alex",
"belt": "black",
"amount": 232
}
]

组件 HTML

<li *ngFor="let ninja of ninjas | filter:term | sum" >
<p>{{ninja.amount}}</p>
</li>

总管

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'sum'
})
export class SumPipe implements PipeTransform {

  transform(ninjas: any, term: any): any {

  return ninjas.reduce(function(a,b){return a + b});
  }
}
4

1 回答 1

0

我不认为你可以。过滤 xour 组件或服务中的数据，并将过滤后的 redult 分配给字段并绑定ngFor到该字段。从过滤后的数据中计算总和并将其分配给一个字段并将视图绑定到该字段。

于 2016-12-19T08:25:38.290 回答