2017-12-24 3 views
1

私のプロジェクト、私は、ユーザーが任意のオプションを選択せず​​に離れたときに、テキストフィールドの空白を作るために、次のコードを使用しています、角度材料2と同じ形式で3つのオートコンプリートコンポーネントを使用してMatAutocompleteTrigger

@ViewChild(MatAutocompleteTrigger) bedTrigger:MatAutocompleteTrigger; 
bedTrigger.panelClosingActions 
     .subscribe(e => { 
      console.log("ward"); 
      if (!(e && e.source)) { 
      this.orgInfoForm.get('fieldName').setValue(null); 
      this.wardTrigger.closePanel(); 
      } 
}); 

bedTrigger最初のオートコンプリートになかれ参照コンポーネントは、他の2つのオートコンプリートコンポーネントを参照できません。私は、私が

@ViewChild(MatAutocompleteTrigger) triggers:QueryList<MatAutocompleteTrigger>; 

は、すべてのトリガを参照しようと、各autocompeteは1 MatAutocompleteTrigger、フォームのactuall一つだけMatAutocompleteTriggerこの1つの参照最初のオートコンプリートコンポーネントを取得だと思うが、私は一つだけMatAutocompleteTrigger.PleaseがどのようにMatAutocompleteTriggerを得るために私を導く取得しますangualr 2バージョン5.0.2の他の2つのオートコンプリートコンポーネントへの参照。

+0

私は、ViewChildは常に一致するDOM内の最初のものを取得するので、私はあなたがViewChildだけでやっていることを達成できるとは思わないと思います。代わりに3つのテンプレート参照変数を使用してみましたか? – yoonjesung

答えて

0

これはいいです。 OK、すべての最初は、あなたが

@ViewChildren(MatAutocompleteTrigger) triggerCollection: QueryList<MatAutocompleteTrigger>; 

その後@ViewChildの代わりに@ViewChildren使用し、QueryList必要があり、各要素のトリガーにアクセスするには、反復処理する必要があります

for (var trigger of this.triggerCollection.toArray()) { 
    trigger.panelClosingActions 
    .subscribe(e => { 
    if (!(e && e.source)) { 
     // do whatever you need 
    } 
    }); 
} 

を、私はそれを願っています助けて!

関連する問題