Angular's * ngIf zeigt nicht die Tamplate der Komponente

Question

Ich habe eine Weile nicht mit Angular gearbeitet, aber ich erinnere mich, dass ich die Elemente mit * ngIf ausgelöst habe. Ich bin mir nicht sicher, was los ist. Wenn ich die Funktion geradeaus trigge <button (click)="play()">...</button> funktioniert es, aber ich sehe nicht den Punkt, warum es nicht funktioniert mit Objekt Eigenschaft. Wenn die Eigenschaft des Objekts verwendet wird, wird die Methode ausgelöst, aber der Wert wird nie geändert (ist es nicht die gleiche Instanz oder etwas?).

Komponente:

public showPlay: boolean = false; 
public arr: Array<Object> = [ 
    {clickHandler: this.play} 
]; 

play(): void { 
    this.showPlay = !this.showPlay; 
} 

Vorlage:

<button *ngFor="let button of arr" (click)="button.clickHandler()">Click</button> 
<play-interface *ngIf="showPlay"></play-interface> 

Answer 1

Sie können etwas tun,

<button *ngFor="let button of arr" (click)="self[button.clickHandler]()">Click</button> 
<div *ngIf="showPlay">hi</div> 

und in Vorlage,

export class AppComponent { 
public showPlay: boolean = false; 
public arr: Array<Object> = [ 
    {clickHandler: 'play'} 
]; 
get self() { return this; } 

play(): void { 
    this.showPlay = !this.showPlay; 
} 

DEMO