Angular's * ngIfにコンポーネントのtamplateが表示されない

Question

しばらくAngularで作業していませんが、* ngIfを使用して要素をトリガしていました。今、私は何が間違っているのか分かりません。 私は機能をストレート<button (click)="play()">...</button>それを動作させるが、私はそれがオブジェクトのプロパティを使用して動作していない理由が表示されません。オブジェクトのプロパティを使用する場合、メソッドがトリガされていますが、値が変更されることはありません（同じインスタンスではないのでしょうか？）。

コンポーネント：

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

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

テンプレート：

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

Answer 1

あなたはこのような何かを行うことができ、

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

とテンプレートで、

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

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

DEMO