Angular 4 - bug détecté avec PrimNG Datatable

Question

J'ai détecté un bogue dans le module Angular 4 ou PrimNG Datatables.

J'ai vue simple:

<span *ngFor="let node of nodes">{{node.label}}</span> //works with case 1,2,3 and 4 

<p-dataTable [value]="nodes"> //works with case 1, 2, and 3 (but not with 4!) 
    <p-column field="label" header="Label"></p-column> 
</p-dataTable> 

et le code dans le composant:

private nodes:any[] = [] 

ngOnChanges() { 
    //case 1 -> ok 
    //this.nodes.push({label: 'foo'}) 

    //case 2 -> ok 
    //this.nodes = [{label: 'foo'}] 

    this.someService.getAll().subscribe(      
     records => { 
      //case 3 ->ok 
      //this.nodes = [{label: 'foo'}] 

      //case 4 -> BUG 
      //this.nodes.push({label: 'foo'}) //datatable is not updated 
     } 
    ) 
} 

Quand je lance ce code avec cas décommentée 1, 2 ou 3 tout est OK, mais quand je suis en train pour exécuter le cas 4 (identique au cas 1 mais après la résolution du service) - les données primaires ne semblent pas voir de changements. Dans Angular 2, je n'avais pas ce problème. Pourriez-vous m'expliquer ce qui se passe ici? :)

Cordialement

Answer 1

Vous devriez avoir le même comportement dans angular2 et angular4. En fait ce n'est pas un bug, c'est le comportement attendu. Il s'agit de faire avec comment détecter angulaire changement. Pour détecter le changement angulaire il suffit de faire un ===.

Dans votre cas 1, cela fonctionne parce que la fonction changeDetection est déclenchée par le ngOnChange lui-même.

Mais dans votre cas 4 vous ajoutez simplement une valeur à votre tableau sans changer la référence du tableau nodes.

Pour les autres cas, vous changez la référence à nodes afin que angulaire soit capable de détecter les changements.

Je vous conseille de regarder une cette réponse il a beaucoup plus de détails: Angular2 change detection: ngOnChanges not firing for nested object