在第一个结束后在后台进行第二个 API 调用

Question

public LoggedInUser$:Observable<any> = new Observable(observer => {
        this._loggedInUser = observer;
        this.api$.make_api_call('getapplication').subscribe(d => {
           // do Something            
        });
    });

How do I latch on another API call to this observable that'd be asynchronous or at least fired up after the response of getapplication ? I tried adding in another API call inside like -

        let params = {
            'all_applications': true
        };
        this.api$.make_api_call('getallapplications', params).subscribe(d => {
            // do Something           
        });

but it doesn't solve my purpose and both the calls are made almost simultaneously.

These are two separate calls and not dependent on each other. Idea is to bring in individual application data for the user and once that's done, running an async call (or maybe something in the background) to get rest of the applications and cache it in Redis.

The requirement is to bring in a single application data for a customer. At the same time bringing in all the other applications data so that when user switches between it, user experience doesn't suffer.

Answer 1

Can you try concatMap ? ConcatMap helps you to process the requests in sequence ie ones you get the response for first your next call gets executed.

 import { of } from 'rxjs'; import { ajax } from 'rxjs/ajax'; import { map, concatMap } from 'rxjs/operators'; const users$ = ajax.getJSON('https://api.github.com/users'); users$.pipe( concatMap(users => { const userId = 1; console.log('concat users', users) return ajax.getJSON(`https://api.github.com/users/${userId}`) }) ).subscribe(user => console.log('user', user));

Here is the stackblitz URL

concatMap RXJS example

In your case, try this

 this.api$.make_api_call('getapplication').pipe( tap(response => console.log('First API response'), concatMap(response => { let params = { 'all_applications': true }; return this.api$.make_api_call('getallapplications', params) }) ).subscribe(response => console.log('2nd API Response', response));