Pass the value from WithLatestFrom to another operator - Rxjs, Ngrx effect

user_5573733 0
Viewed 312

I've got this ngrx effect and I want to use the data from my state using withLatestFrom.

$loadProduct = createEffect(() =>
  this.actions$.pipe(
    ofType(fromActions.loadProduct),
    withLatestFrom(this.store.select(fromSelectors.debounceTime)),
    delay(debounceTime), // how can I get the debounceTime value up here?
    map(_ => fromActions.foo())
  )
)

How can I get this debounceTime value within the scope of delay?

rxjs ngrx
2 Answers

Since delay is just delayWhen(() => timer(duration));, I think you can use delayWhen to solve the problem:

$loadProduct = createEffect(() =>
  this.actions$.pipe(
    ofType(fromActions.loadProduct),
    withLatestFrom(this.store.select(fromSelectors.debounceTime)),
    
    delayWhen(([, debounceTimeVal]) => timer(debounceTimeVal)),

    map(_ => fromActions.foo())
  )
)

As a side note, delayWhen is just an interesting use case of mergeMap: instead of emitting the inner value, the outer value is emitted instead.

user_96326210

How about this:

$loadProduct = createEffect(() =>
  this.actions$.pipe(
    ofType(fromActions.loadProduct),
    withLatestFrom(this.store.select(fromSelectors.debounceTime)),
    switchMap(([_, debounceTime]) => timer(debounceTime)),
    map(_ => fromActions.foo())
  )
)

It's using RxJS's switchMap and timer instead of delay.

By the way, if you do not need the action somewhere in the subsequent part of the pipe, you may also use switchMap instead of withLatestFrom like this:

$loadProduct = createEffect(() =>
  this.actions$.pipe(
    ofType(fromActions.loadProduct),
    switchMap(() => this.store.select(fromSelectors.debounceTime)),
    switchMap(debounceTime => timer(debounceTime)),
    map(() => fromActions.foo())
  )
)
user_22988960
Related