How to return the parent observable value?

Question

I'm trying to nest some http requests using mergeMap. The API I'm using returns the data in parts(pages), so I need to make more requests depending in the number of total pages.

Since I need to make a request to know how many pages are. I always make the first one in the first page. With the result of that one I can know how many pages are, and start making the other requests (starting from page 2).

Once I subscribe to the returned observable I get all the data of the requests made within the mergeMap, except the result of the first one (the one with page = 1).

Is there a way to return the first request data?

I tried to start the inner request with page = 1, but I don't like it that way because I already have the data of that request.

This is the return value of the function:

 return this.getScrobblesFromAPI( userName, oneWeekAgoUnix, 1 )
    .pipe(
      mergeMap( data => {
        const totalPages: number = parseInt(data['recenttracks']['@attr'].totalPages, 10);
        const pages: number[] = [];
        //Starting from page 2
        for (let i = 2; i <= totalPages; i++) {
          pages.push(i);
        }
        return from(pages).pipe(
          mergeMap( page => this.getScrobblesFromAPI(userName, oneWeekAgoUnix, page)),
        );
      }),
      map( data => data['recenttracks']['track'].slice(1) )
  );

This function returns the observable of the http.get() (HttpClient)

private getScrobblesFromAPI( userName: string, from: number, page: number ){
   // http : HttpClient
   return this.http.get('url & params');
}

A.Winnen A.Winnen · Accepted Answer · 2019-05-19T19:34:40

I can think of two options to solve this:

Create an empty array and push all your data in there. At the end of the outer pipe return that array so it will go into subscribe callback.

simply use concat function to concat the data from the first call with the additional Observables which will retrieve the remaining pages.

return concat(
    of(data), 
    from(pages).pipe(
      mergeMap( page => this.getScrobblesFromAPI(userName, oneWeekAgoUnix, page)),
    )
);

How to return the parent observable value?

1 Answers