Multiple Dependent Requests at Angular

Asked

Viewed 181 times

1

Hello, I’m doing a process at the angular, in the 'ngOnInit()' method, where I need to perform 3 HTTP methods, which are asynchronous. one depends on the other’s answer. for example:

1° call: get a token

2° call: will only take place after 1°, and will get longitude and latitude

3° call: you will receive a list of objects, passing as parameters the token and the coordinates.

However, I do not know how to perform these methods in order, that is, wait for the answer from one to start the other...

Code of 1° called: 

ngOnInit(): void { 
    this.apiDeSegurancaService.ObterToken().subscribe(
        res => { 
            this.apiDeSegurancaService.AdicionandoToken(res.access_token); 
        }, 
        error => { 
            console.log(error._body); 
            this.token = this.apiDeSegurancaService.ObtendoToken();
        }
    );
}

Thank you in advance....

angular http typescript

  • William has now become clearer to me. You can do this in some ways. How would I do: Call one inside the other’s subscribe. I had a very similar situation to catch the state and city ... I did it like this: this.cidadeService.getByIbge(response.ibge)
 .subscribe(res => {
 setTimeout(() => {
 this.cliente.cidade = res[0];
 this.getCidade(this.cliente.cidade.estadoId);
 }, 500)
 }); And inside my getCidade I made the call to another api

  • By always making the call within the previous request’s subscribe you will be sure that it will only be executed after the request’s reply. It would also be possible to do with async and await or even what I find more incorrect but possible is performing events with Eventemitter...

  • But I believe the first suggestion I gave you is the most suitable for your need.

  • So I would not like to do inside the subscribe, as I would like to do more uncoupling, you know? and I would have to go through the 1°parameter; to the 2°, because it would be the 2°; it would call the 3°; and the 2°; it would not use this parameter, it would receive it then only to serve as a bridge to the 3°. Do you understand? rsrs got a little confused

  • I understood, however in the 3 forms there would be an interdependence. If you use async and await... you would have to call the second method within then , and if you do with Event emitter you would have to subscribe to the event. Another way to do this would be with set timeout to only run after a while but then depending on the connection would no longer work.

  • If it’s not too much trouble, you could assemble an example using Event emitter?

  • Technically you will create an object Output() changeValue: EventEmitter<any> = new EventEmitter(); Inside the first one’s subscribe you would have an Emit passing the data you would need. this.changeValue.emit(fn); E debois would retrieve this data as follows: this.changeValue.subscribe( e => { &#xA; //Do your job&#xA;})

Show 2 more comments

1 answer

0


It is possible to perform this process using the switchmap, in the first calls and in the last use the Subscrible();

Ex:

Chamadadaapi1(). switchmap(res => Chamadadaapi2()). subscrible();

Browser other questions tagged angular http typescript

You are not signed in. Login or sign up in order to post.