Angular 2: Ansicht aktualisiert nicht, wenn Array aktualisiert wird

Question

Ich habe eine Komponente mit zwei Array. arrayA und arrayB. arrayB enthält gefilterte Elemente von arrayA. Und in der Vorlage:

<div *ngFor="let elem of arrayB">{{elem.something}}</div> 

Ich habe einen Knopf zu:

<button (click)="doSomething()">Do Something</button> 

In doSomething Methode, die ich die Filter-Methode auf arrayAarrayB zu aktualisieren.

doSomething() { 
    this.arrayB = this.arrayA.filter(elem => { return ***some code***; }); 
} 

Das Problem ist, dass die Ansicht nicht aktualisiert wird. Ich habe versucht, NgZone zu verwenden (ngZone.run(): Ich habe den Code in der Methode eingepackt.) Und ChangeDetectorRef (detectChanges()/markForCheck(): Ich habe dies am Ende der Methode aufgerufen.) Auch.

Was sollte die Lösung dafür sein?

Answer 1

Es sollte funktionieren! stellen Sie sicher, dass Ihr Filter funktioniert, überprüfen Sie bitte folgendes Beispiel:

<div *ngFor="let elemB of arrayB">{{elemB}}</div> 
<strong>array A :</strong> 
<div *ngFor="let elemA of arrayA">{{elemA}}</div> 
<button (click)="doSomething()">Do Something</button> 

TS:

arrayA = [0,1,2,3,4]; 
arrayB = []; 

doSomething(){ 
    this.arrayB = this.arrayA.filter(x => { return x > 2; }); 
} 

https://plnkr.co/edit/VQYoVIGoioPwjW1ThcFQ?p=preview

Answer 2

Im doSomething() Methode, die ich mit true zurückgegeben. Aus diesem Grund hat die Methode zweimal ausgelöst. Also die Lösung ist immer mit false zurückzukehren.