Get the value of obserable inside obserable rxjs

Question

I have below Observable

  config$: Observable<QueryBuilderConfig>;

this.config$.pipe(map(item => {
  return {
    fieldGroups: [
      { id: CustomAttributeEntityType.Risk, label: this.l('Risk') },
      { id: CustomAttributeEntityType.RiskAssessment, label: this.l('Risk Assessment') }
    ],
    fields: this.metricCreateConfigureStore.queryBuilderFields$, // Get the value from obserable
    allowEmptyRules: true,
    allowEmptyRulesets: false
  }
}));

In the field attribute, I want to get the value from another observable, something like below

 fields: this.metricCreateConfigureStore.queryBuilderFields$

queryBuilderFields$ return Observable as below

readonly queryBuilderFields$: Observable<{ [key: string]: QueryBuilderFieldsDto }> = this.select(state => state.queryBuilderFields);

How can I get the value, without subscribe over there??

Hello, if the initial condition for this to work is the `queryBuilderFields$`, you should use it first in your stream, and use `switchMap` operator to continue with the `config$` Observable. You can find details of the mechanism here : https://blog.angular-university.io/rxjs-higher-order-mapping/. — Alain Boudard, Jul 01 '22 at 08:36

score 2 · Accepted Answer · answered Jul 01 '22 at 08:48

Depends on what you exactly mean by "value from other observable": two streams emitting independently, and you want to catch values from both? That's

combineLatest([stream1$, stream2$])
    .subscribe(([val1$, val2$]) => //...

Or use value from one stream to create another one? That's switchMap (or maybe one of its siblings, like concatMap, mergeMap etc.):

stream1$.pipe(
    tap(/* maybe some side effects here */),
    switchMap(value1 => generateStream2(value1))
).subscribe(value2 => //...

There, that exactly @mbojko :) – Alain Boudard Jul 01 '22 at 10:07 — Alain Boudard, Jul 01 '22 at 10:07

score 0 · Answer 2 · answered Jul 01 '22 at 10:18

That would be something like


this.metricCreateConfigureStore.queryBuilderFields$.pipe(
   switchMap((fields) => this.config$.pipe(
      map((item) => {
         return { ... use fields and item }
      })
   ))
)

And also, I would not use this.l() function call inside the stream handlind, but put a parameter to be used, so pure function.

Get the value of obserable inside obserable rxjs

2 Answers2