どのよう

Question

I親成分を有する親コンポーネント内の子コンポーネントから関数を呼び出すために、私は方法 をonSubmit（）{}

IのをonSubmitを呼び出すために質問を有するを有する子コンポーネントで

<div md-dialog-content> 
    <div class="section-top"> 
    <p id="title" style="float:left;">Adding Dockument</p> 
    <div md-dialog-actions style="float:right;"> 
     <button class="edm-button inline" md-button (click)="onNoClick()" tabindex="-1">Cancel</button> 
     <button class="edm-button inline" md-button (click)="onClick()" tabindex="-1">Confirm</button> 
    </div> 
    </div> 
    <div> 
    <app-document-data [buttonMessage]="buttonMessage"></app-document-data> 
    </div> 
</div> 

（）私はボタンをクリックすると、パラレルコンポーネントで確認を行います。

私はおそらく@Inputと@Outputデコレータを使用すべきであることを知っていますが、どのように正しく適切かわかりません。

Answer 1

でも簡単にあります：あなたの子供のテンプレートの参照を与え、あなたはそうのようにその機能を呼び出すことができます。あなたの親コンポーネントで（私は2番目のボタンが電話をかけるだろうと思います）

<div md-dialog-content> 
    <div class="section-top"> 
    <p id="title" style="float:left;">Adding Dockument</p> 
    <div md-dialog-actions style="float:right;"> 
     <button class="edm-button inline" md-button (click)="onNoClick()" tabindex="-1">Cancel</button> 
     <button class="edm-button inline" md-button (click)="appDD.onSubmit()" tabindex="-1">Confirm</button> 
    </div> 
    </div> 
    <div> 
    <app-document-data #appDD [buttonMessage]="buttonMessage"></app-document-data> 
    </div> 
</div> 

Answer 2

：

あなたの子供で

onClick(){ 
    this.buttonMessage = true; 

：

@Input() buttonMessage: boolean; 

とngOnChanges：

ngOnChanges(changes: any) { 
    if(changes.buttonMessage.currentValue){ 
    this.onSubmit();