计算角 2 和离子 2 ngfor 中的元素总和

Question

我正在开发一个带有ionic 2的移动应用程序，我当然需要每个比赛表并计算每年的分配总和。我尝试使用此代码，但它不起作用。你能帮我吗？

   <ion-row *ngFor="let ch of cheval1 ">
      {{ch[0].annee }}
    <div *ngFor="let m of members  ; let rowIndex = index">
            <ion-col *ngIf="ch[0].annee == (m.Course.date |date : 'yyyy' )">
            {{ m.Course.allocation}} 
            </ion-col>
     </div>

元件

@Component({
  selector: 'page-view-cheval',
  templateUrl: 'view-cheval.html',
})
export class ViewChevalPage {
  cheval ;
  crs = 0 ;
  cheval1 ;
  members ;
  vcheval : string ="Compteurs";
  constructor(public navCtrl: NavController, public navParams: NavParams, public data: ServiceProvider ,public menuCtrl: MenuController ) {
      this.cheval = navParams.data.member;
       this.getIdCheval() ;
  }
  getIdCheval() {
        return   this.data.viewCheval(this.cheval.Cheval.id)
         .subscribe(
                  data=> {
                      this.members = data.course_cheval;
                      this.cheval1 =data.engagements;
                       console.log(this.members[1].Entraineur.nom);
                          console.log(data);
                  },
                  err=> console.log(err)
            );
  }

Fiche JSON：

Course: {
    id: "460",
    date: "2012-06-24",
    nom_du_prix: "GODOLPHIN ARABIAN",
    allocation: "20000",
    hippodrome_id: "2",
    jouree: "36",
    categorie_id: "1",
    distance: "1600",
        },
    Course: {
    id: "306",
    date: "2013-02-17",
    nom_du_prix: "HAMADI BEN AMMAR",
    allocation: "12000",
    hippodrome_id: "2",
    jouree: "10",
    categorie_id: "2",
    distance: "1600",
    },
    Course: {
    id: "328",
    date: "2013-03-31",
    nom_du_prix: "DE L’ INDÉPENDANCE",
    allocation: "25000",
    hippodrome_id: "2",
    jouree: "19",
    categorie_id: "1",
    distance: "2000",
    },
    engagements: [
    [
    {
    annee: "2015"
    }
    ],
    [
    {
    annee: "2014"
    }
    ],
    [
    {
    annee: "2013"
    }
    ],
    [
    {
    annee: "2012"
    }
    ]
    ]

Answer 1

你可以在组件中做到这一点：

allocationSum: number;
// other variables
getIdCheval() {
  // ...
  this.members = data.course_cheval;
  this.allocationSum = this.members.reduce((previous, current) => {
    return previous + parseInt(current.Course.allocation);
  }, 0);
}

或者创建管道：

@Pipe({ 
  name: 'sumByAllocation' 
})
export class SumByAllocationPipe implements PipeTransform {
  transform(input: any): number {
    if (Array.isArray(input)) {
      return input.reduce((previous, current) => {
        return previous + parseInt(current.Course.allocation);
      }, 0);
    }
    return input;        
  }
}

在模板中：

<div> Total Allocation: {{members | sumByAllocation}} </div>