Branderson20
Branderson20

Reputation: 326

RxJS Chaining observable issues

I'm trying to change my current code, of calling an observable in another observable code by using merge map

This code does work but I know it's bad practice so I'm trying to refactor it

this._headerRefresh$.pipe(debounceTime(this.debounceTime)).subscribe(data => {
            this._outputProvider
                .getData(this.to.url, this.to.body ? this.to.body : undefined)
                .pipe(
                    debounceTime(this.debounceTime),
                )
                .subscribe(res => {
                    this.setstuff(res);
                });
        });

I tried to do it this way, but it not quite calling the this.setstuff(res)

this._headerRefresh$
        .pipe(
          debounceTime(this.debounceTime),
          mergeMapTo(
            this._outputProvider
              .getData(this.to.url, this.to.body ? this.to.body : undefined)
          ),
        )
        .subscribe(res => {
          console.log(res);
          this.setstuff(res);
        });

Is there anything that I missed?

Upvotes: 0

Views: 151

Answers (1)

bryan60
bryan60

Reputation: 29315

if this.to.url and this.to.body are dynamic, you can't use mergeMapTo ... you have to use mergeMap so they can be re evaluated on each emission, rather than just once when the stream is built:

      mergeMap(() =>
        this._outputProvider
          .getData(this.to.url, this.to.body ? this.to.body : undefined)
      ),

you also may really want switchMap or exhaustMap instead of mergeMap... the behaviors are slightly different.

with mergeMap, every emission of the outter will trigger the inner, and all inners will emit till they complete. they will arrive in the order they arrive, not in the order they were triggered by the outter. so this could result in unneeded http calls in the best case, or getting stale data in the worst case.

with switchMap, new emissions will cause prior inner observables that are still active to cancel, and it will switch to the new call.

exhaustMap is sort of the opposite, it will ignore outter emissions while any inner is active. it's rarely used, but a refresh signal is the classic use case since you usually don't want to restart your refresh or trigger more while a refresh is already in flight.

Upvotes: 1

Related Questions