web-dev-qa-db-fra.com

L'appel d'une fonction sur ngOnInit est-il asynchrone?

Si j'appelle une fonction dans ngOnInit () qui effectue un appel observable pour obtenir des données, l'appel this.getSomething () dans ngOnInit est-il toujours asynchrone ou ngOnInit attend-il que this.getSomething () renvoie un résultat? Fondamentalement, "doSomethingElse" est-il exécuté dans ngOnInit () avant ou après la fin de this.getSomething ()?

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

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

ngOnInit() sur lui-même n'attend pas les appels asynchrones. Vous pouvez vous-même coder en chaîne la façon dont il s'exécute uniquement lorsque l'appel asynchrone est terminé.

Par exemple, ce que vous mettez dans subscribe(...) est exécuté lorsque les données arrivent.

Le code qui vient après que subscribe(...) est exécuté immédiatement (avant que l'appel asynchrone ne soit terminé).

Il existe des hooks de cycle de vie de routeur qui attendent les promesses retournées ou observables, mais aucun des hooks de cycle de vie de composant ou de directive ne le fait.

mise à jour

Pour vous assurer que le code après l'exécution de this.getSomething() lorsque getData() est terminée, remplacez le code par

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
Günter Zöchbauer