dxTemplate内のフォームにアクセスする方法Devextreme dxPopover in Angular2

Question

以下のようにdxPopover内にあるフォームの変更を購読する必要がありますが、フォームは常に定義されていません。

ただし、フォームをdxPopoverの外に移動すると、問題はありません。

フォーム要素がdxPopoverの内部にあるときにフォーム要素にアクセスするにはどうすればよいですか？

テンプレート：

<dx-popover 
       target="#button" 
       position="bottom" 
       width="900px" 
       [visible]="true"> 

    <div *dxTemplate="let data of 'content'"> 
      <form #form="ngForm" > 
       <!-- form content --> 
      </form> 
    </div> 
</dx-popover> 

コンポーネント：

@ViewChild('form') form; 

ngAfterViewInit() { 
    console.log(this.form); // outputs 'undefined' 

} 

編集：ここではplunkある - https://plnkr.co/edit/nQJ0brGs0FlMBkexuavK

Answer 1

オプション1：あなたが内部行ったよう

はHTMLを渡しますdxPopoverタグをreにする<ng-content>をdxPopoverのテンプレートの中に追加して注入するようにします。そして、ビューのinitライフサイクルフックの後で、問題の変数にアクセスすることができます。

オプション2：

あなたが実際のコンポーネントテンプレート内でごdx-popoverコンポーネントディレクティブ内部divことを移動しなければなりません。

その後、dx-popoverコンポーネントに

をホストしている親コンポーネントにフォームの値を発するように出力デコレータを使用して、dx-popoverコンポーネントにデータを渡したい場合は、他のように、入力デコレータを使用することができます道の周りに。

私はこの単純なタスクのための入力/出力を使用する理由私は理解している場合はわからない例Here