コール<ng-content>の内側にあるコンポーネントのメソッドすべての

Question

まずここでは基本的にPlunkr

ですが、私は動的であるタブコントロールを持っています。任意の数のタブがあります。各タブには、この「遅延ロード」コンポーネントから継承するコンポーネントが含まれます。私が達成したい機能は、ユーザーがタブをクリックすると、タブ内に含まれているコンポーネントの中から「loadData」を呼び出します。

@ViewChildまたは@ContentChildを使用して子コンポーネントにアクセスしようとしましたが、何も試しても動作しないようです。

<div [hidden]="!active" class="pane"> 
    <ng-content></ng-content> 
</div> 

とタブコンポーネント内のプロパティ「アクティブ」のセッターに、私は内に保持されているものの成分の.loadData（）メソッドを呼び出したい：

タブのテンプレートがあります素子。これは達成可能ですか？

Answer 1

それは

ngAfterContentInit() { 
    if(this.component) { 
     this.component.loadData(); 
    } 
    } 

    @ContentChild(DelayLoadComponent) component: DelayLoadComponent; 

と私のために動作しますが、それは怠惰な負荷コンポーネントません。

Plunker example

おそらくあなたは、タブがアクティブな場合にのみ、DOMにコンポーネントを追加します*ngIfを追加します。あなたは私が解決策としてそれをマークします（小さな記述に）答えを提出したい場合