How to parametrize Rx delay() function inside Ngrx effect?

Question

I'm trying to achieve configurable delay in ngrx effect. However RxJS delay() function cannot receive lambda as a parameter, only number | Date. What I'm trying to do is tap and store value from the payload into some global variable and then use it as a parameter for delay() but it doesn't work. delay() seems to be called with the old variable value. Here is the code snippet for reference:

@Effect()
  delayHideRx$ = this.actions$
    .ofType(IconsActions.DELAY_HIDE_RX)
    .pipe(
      tap((action: Action) => { rxDelay = action.payload }),
      delay(rxDelay),
      map(() => {console.log('delay hide rx'); return IconsActions.hideRx(rxDelay)})
    );

Basically what I'm trying to achieve is kind of setTimeout() functionality, but with actions only.

In general the task sound like that: Once we receive push from the server, we need to show some icon and hide it after certain amount of time. Amount of time comes from the server.

I will appreciate any suggestions on how to parametrize delay() input parameter and also any explanation on why delay taking previous value in that case.

Thanks!

Answer 1

You can use a mergeMap operator

myObs$.pipe(
  mergeMap(payload => {
    return of(payload)
      .pipe(delay(payload.delay))
  })
);