Berechnung der Summe der Elemente in Angular 2 und ionischen 2 ngfor

Question

Ich entwickle eine mobile Anwendung mit ionischen 2 und ich brauche für jeden natürlich die Renn-Tabelle und berechnet die Summe der Zuteilung pro Jahr. Ich habe es mit diesem Code versucht, aber es funktioniert nicht. Kannst du mir bitte helfen?

<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> 

Komponente

@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

Sie können es in der Komponente tun:

allocationSum: number; 
// other variables 

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

Oder die Schaffung eines Rohr:

@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;   
    } 
} 

Und in Vorlage:

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