CODEWITHSUNDEEP
angularrxjsobservable
Aleksandr Gorin
Aleksandr Gorin

Reputation: 27

Observable - make queue of dynamic requests (angular 4)

I have a question about observable. For example, we have api, and send a reguest there:

this.http.get('https://swapi.co/api/people/').subscribe(peoplesData => {
   let peoples = peoplesData.json();
   let nextPage = peoples.next; // https://swapi.co/api/people/?page=2
   this.peoples = peoples.results;
});

When I send first request, I will get url for next request (in this example, url contains in 'nextPage'). I need to create method, which will make all request, and after every requests will add all 'results' to 'this.peoples'. I think, .mergeMap and switchMap don't fit for it. Maybe are you have more expirience with Observable? Please help me with this method.

Update I solved this problem with .expand:

return this.http.get('https://swapi.co/api/people/')
      .expand(peoplesData => {
        let peoples = peoplesData.json();
        if (peoples.next) {
          return this.http.get(peoples.next);
        } else {
          return Observable.empty();
        }
      })
      .map(peoples => peoples.json());

Upvotes: 0

Views: 841

Answers (1)

abahet
abahet

Reputation: 10643

My solution using rxjs Rx flatMap :

import {Observable} from 'rxjs/Rx';


ngOnInit() {
  const arrayIds = [2456, 12456, 456, 7899];
  this.doUsersRequest(arrayIds);
}

doUsersRequest(queryArr, previousObservable = null) {
        if (queryArr.length) {
            const url = 'api/users/id/' + queryArr.shift();
            let observable = null;
            if (previousObservable) {
                observable = previousObservable.flatMap(() => {
                    return this.http.get(url);
                });
            } else {
                observable = this.http.get(url);
            }
            return this.doUsersRequest(queryArr, observable);
        } else {
            return previousObservable;
        }
    }

Upvotes: 1

Related Questions