1
votes

Méthode d'attente angulaire 6 avec abonnement à l'intérieur

Je dois appeler un service plusieurs fois, par forEach, une méthode qui a subscribe (appel http) à l'intérieur et je dois à chaque fois attendre la fin de l'appel précédent. Voici le code:

selectComponent(agentName: string, propName: string, schemaPath: string, dataPath: string, deepLevel: number) {
        this.getComponentSchema(this.agentName, schemaPath, deepLevel)
            .subscribe((responseSchema) => {
                this.getDataFailure(propName, dataPath, responseSchema); 
            });
}

à l'intérieur de componentService:

setAgent(agent: Agent) {
        this.agent = agent;
        this.selectComponent(agent.name, undefined, "/", "/", environment.maxLevelJsonSchema);
    }

et selectComponent a l'abonnement.

itemDefaultConfiguration.command = (onclick) => {
   this.createConfiguration(configuration.components);
   //wait the end of createConfiguration method that has subscribe (http call) inside
   this.initializeAllComponents(configuration.components)
};

initializeAllComponents(components: Agent[]) {
    components.forEach(agent => {
      this.componentService.setAgent(agent);
      this.componentService.clearAnyOneOfIndex();
      // wait the end of setAgent method that has subscribe(http call) inside
    })
}

javascript typescript angular asynchronous http

4 commentaires

Qu'avez-vous essayé? Vous devez faire des efforts au lieu de nous demander de le faire pour vous. À première vue, vous devriez probablement repenser la stratégie.

J'ai essayé avec async / await mais pas de changement, je pensais qu'il y avait un moyen par RxJS

@ veuillez afficher la méthode selectComponent

mise à jour avec l'abonnement

3 Réponses :

0
votes

Vous pouvez le faire en utilisant wait a >, comme:

initializeAllComponents(components: Agent[]) {
    components.forEach(async agent => {
      await this.componentService.setAgent(agent).catch(console.log);
      this.componentService.clearAnyOneOfIndex();
      // wait the end of setAgent method that has subscribe(http call) inside
    })
}

5 commentaires

il n'attend pas la fin de l'appel

Cela signifie que setAgent renvoie les données avant!

Oui, setAgent appelle une autre méthode qui a l'abonnement

Essayez de faire en sorte que setAgent renvoie l'abonnement lui-même dans setAgent, et utilisez ici await setAgent (). ToPromise ()

forEach n'attend pas, vous devez utiliser la boucle for normale, voir ma réponse.

0
votes

Vous pouvez y parvenir en utilisant async / await syntaxe:

initializeAllComponents(components: Agent[]) {
    for (let i = 0; i < components.length; i++) {
        const agent = components[i];
        await this.componentService.setAgent(agent).catch(console.log);
        this.componentService.clearAnyOneOfIndex();
    }
}

Soyez prudent avec async / await , car vous devez utiliser la boucle native for pour attendre la précédente call - forEach , reduction et des méthodes similaires déclenchent simplement plusieurs appels asynchrones.

0 commentaires

0
votes

S'il est Observable , essayez d'utiliser l'opérateur switchMap :

async initializeAllComponents(components: Agent[]) {
    components.forEach(agent => {
      let result = await this.componentService.setAgent(agent);
      this.componentService.clearAnyOneOfIndex();
      // wait the end of setAgent method that has subscribe(http call) inside
    })
}

Si ce n'est pas Observable code >, puis utilisez les opérateurs async / await :

import { switchMap } from 'rxjs/operators';
import { of } from 'rxjs/observable/of';

initializeAllComponents(components: Agent[]) {
    components.forEach(agent => {
      this.componentService.setAgent(agent).pipe(
           switchMap(res => {
               if (res) { return this.userService.get(user.uid); }

               return of(null);
           }));
      );
      this.componentService.clearAnyOneOfIndex();          
    })
}

2 commentaires

malheureusement ce n'est pas observable

J'ai mis à jour le premier message, setAgent appelle une autre méthode qui a l'abonnement à l'intérieur