ngFor值（数字）的Angular 2摘要

Question

我遇到一种情况，我需要为每个pt（团队任务是动态的并且来自数据库）收集所有team task（数量上）。

TS：

tasks;
  getTeams(){
    this.db.list(`projects/${this.auth.userId}/${this.key}/teams`).snapshotChanges().pipe(
      map(changes =>
        changes.map(c => ({ key: c.payload.key, ...c.payload.val() }))
      )
    ).subscribe((data) => {
      console.log(data);
     this.tasks = data;
    }  )}

HTML：

  <div *ngFor="let t of tasks">
        <p *ngFor="let pt of objectValues(t.tasks)">{{pt.pt}}</p>
      </div>

在我的Firebase数据库照片中解释了两个ngFors：

输出：

我希望每个TEAM的输出只是所有pt的摘要，如何实现？

例如：

正面：10pt（5 + 5）

Backas：5分（5）

添加console.log(data)的控制台日志：

Answer 1

如果我的理解正确，您想对每个任务的要点求和。您使用Array.reduce进行计算：

脚本

getTeamPoints(team) {
  return Object.values(team.tasks).reduce((total, task) => total + parseInt(task.pt), 0);
}

注意：上面的脚本可能应该键入其变量。

查看

<div *ngFor="let team of teams">
  {{team.name}}: {{getTeamPoints(team)}} points
</div>