入れ子の子コンポーネント未定義の入力プロパティ

Question

dataModelを入力とし、コンストラクタの呼び出し時にdataModelを定義したコンポーネントがあります。

<div class="container"> 
    <dataViewer [dataModel]="data"></dataViewer> 
</div> 

@Input() dataModel: DataModel; 

// .. 

constructor(private element: ElementRef) { 
    this.htmlElement = this.element.nativeElement; 
    this.selectorElement = d3.select(this.element.nativeElement); 

    if (this.dataModel== undefined) { throw 'dataModel is undefined' }; 

} 

コンポーネントは、親コンポーネントは、ルートリゾルバを有し、どのようにdataViewerコンポーネントが構築されるときdataModelが設定されていることを確認することができますか？子コンポーネントの構築が遅れて、定義されていないことを確認できますか？

this.route.data 
      .subscribe((data: { foo: Bar[] }) => { 
       self.foo = foo; 
      }); 

Answer 1

コードをコンストラクタからネストされたコンポーネントのngOnChangesイベントに移動することを検討してください。このイベントは、dataModelプロパティが設定または変更されたときに発生します。

コンポーネントが最初に読み込まれたときに未定義が表示されないようにするには、ifコードが必要です。