How can I make a merged observable emit when one of the two observable emits, with the latest value of the other?

Question

I am implementing a filter feature in Angular, and I have two observables: the items$ observable and the itemsFilter$ observable. The first comes from the store, the second comes from a BehaviourSubject.

I'm trying to combine these two observables in order to always apply the filter. Even when the data changes and new items are emitted, the filter has to remain applied. Same if the filter changes.

I tried several operators:

• zip: only emits when both the observables emit
• merge: creates a new observable that emits one single value, from one or the other
• combineLatest: is deprecated
• withLatestFrom(this.itemsFilter$): does not emit when itemsFilter$ emits
• switchMap(() => this.itemsFilter$): does not emit when itemsFilter$ emits
• mergeMap(() => this.itemsFilter$): does not emit when itemsFilter$ emits
• combineLatestAll requires an observable of observables

In the end, I didn't find a suitable operator for my use-case. What's the standard way of implementing filters with ngrx and rxjs observables?

Answer 1

Use combineLatest(args: Observable[]) static import from rxjs or combineLatestWith operator.

Only the combineLatest(...args: Observable[]) overload is deprecated. The combineLatest operator is deprecated.

combineLatest([items$, itemsFilter$])

or

items$.pipe(
   combineLatestWith(itemsFilter$),
)