web-dev-qa-db-ja.com

ngOnInitで関数を呼び出すことは非同期ですか?

データを取得するために監視可能な呼び出しを行うngOnInit()の関数を呼び出す場合、ngOnInitのthis.getSomething()呼び出しはまだ非同期ですか、またはthis.getSomething()が結果を返すまでngOnInitは待機しますか?基本的に、doSomethingElseは、this.getSomething()の終了前または終了後にngOnInit()で実行されますか?

ngOnInit() {
    this.getSomething();
    doSomethingElse;
}

getSomething() {
    this.someService.getData()
        .subscribe(
            result => {
                this.result = result;
            },
    error => this.errorMessage = <any>error);
}
10
Felix

ngOnInit()自体は、非同期呼び出しを待機しません。非同期呼び出しが完了したときにのみ実行されるようにコードをチェーンすることができます。

たとえば、subscribe(...)内に配置したものは、データが到着したときに実行されます。

subscribe(...)の直後にあるコードは、(非同期呼び出しが完了する前に)すぐに実行されます。

返されるpromiseまたはobservableを待機するルーターライフサイクルフックがいくつかありますが、コンポーネントまたはディレクティブライフサイクルフックは待機しません。

更新

this.getSomething()が完了したときにgetData()が実行された後のコードを確認するには、コードを

ngOnInit() {
    this.getSomething()
    .subscribe(result => {
      // code to execute after the response arrived comes here
    });
}

getSomething() {
    return this.someService.getData() // add `return`
        .map( // change to `map`
            result => {
                this.result = result;
            },
  //  error => this.errorMessage = <any>error); // doesn't work with `map` 
  // (could be added to `catch(...)`
}
18