How to nest http calls in angular

Question

Hi I need to nest 3 calls in Angular9. where :

All call's are inter-dependent
All calls can give error

a.How can i write the code in a better way?

b.Can i use RXJS?

c.How to nest along with error block in RXJS?

example:

this.http.get('/api/people/1').subscribe(character => {
      this.http.get('/api/people/character ').subscribe(homeworld => {
            this.http.get('/api/people/character/homeworld  ').subscribe(finalResponse=> {
                 console.log(finalResponse);
            },
             error =>{
                  console.log(error);
            });
      },
      error =>{
           console.log(error);
      });
},
error =>{
   console.log(error);
});

This article may help you understand the main mechanics of rxjs with http calls — Picci
– Picci, Commented Apr 29, 2020 at 6:35

Yasser Nascimento · Accepted Answer · 2020-04-28 18:09:19Z

2

You will need a higher-order mapping operator to be able to make only once subscription, for example, a switchMap.

const getPeople = id => this.http.get(`/api/people/${id}`);
const getCharacter = character => this.http.get(`/api/people/${character}`);
const getCharacterAgain = character => this.http.get(`/api/people/character/${character}`);

getPeople(1).pipe(
  switchMap(getCharacter),
  switchMap(getCharacterAgain),
).subscribe(...);

edited Apr 28, 2020 at 18:09

answered Apr 28, 2020 at 17:18

Yasser Nascimento

1,38110 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to nest http calls in angular

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related