How to wait for the same observable to finish if called twice in angular?

Question

My question is not the same as how to "How to wait for observable to finish". I already solved this issue in my code by using a switchMap. Currently I have an api get call that before doing the httpget, it will check if the refreshToken is expired, in this case it will generate a new token and wait for it then do the httpget which is great.

My problem is that if I have the following senario:

this.getUsers();
this.getLocations();

Let us take the case where the token needs refresh (we need to wait for the refresh): First we call this.getUsers() this will trigger to create a new token and the get users will happen after the token is created. In parallel we also call this.getLocations() which will also trigger to create a new token and will NOT WAIT for the first get to finish. I need to find a way so that the 2nd get waits for the 1st get to finish so that both will use the same new token.

Answer 1

rxjs operator for you to use in this scenario is forkJoin().

Observable.forkJoin(
    this.http.get('/app/getUser').map((res: Response) => res.json()),
    this.http.get('/app/getLocation').map((res: Response) => res.json())
).subscribe(
  data => {
    this.users = data[0]
    this.locations = data[1]
  },
  err => console.error(err)
);

See this Example: Example of stackoverflow

Also see this to take advantage of Observable in Angular: Take Advantage of Observable