How to make an http call every 2 minutes with RXJS?

Since you are already using Observables, simply make full use of it 🙂 Obersvable.interval() is your good friend here:

In your component, do this:

Observable
    .interval(2*60*1000)
    .timeInterval()
    .mergeMap(() => this.notificationService.getNotifications(this.token))
    .subscribe(data => {
        console.log(data);
    });

Explanation:

  1. .interval() creates an observable that emits an event every 2
    minutes.
  2. .timeInterval() convert an Observable that emits items into one
    that emits indications of the amount of time elapsed between those
    emissions.
  3. .mergeMap() then wraps your each and every of service call,
    transform the results into an observable and return it. This ensure
    that the your service call at 0th, 2nd, 4th, 6th….minute is called
    synchronously. (think of there is a lot of .then()), i.e, service at 2nd minute will only be called on after the 0th minute’s call, and 4th will only after 2nd, and so on.
  4. .subscribe() finally you can subscribe to the data

Update:

If you are using pipeable operators (rxjs5 and above), simply pipe the operators instead of chaining them:

interval(2 * 60 * 1000)
    .pipe(
        mergeMap(() => this.notificationService.getNotifications(this.token))
    )
    .subscribe(data => console.log(data))

Leave a Comment