[Fixed] How to add additional value from one Observable to another?

Issue

Assuming we have the following code:

observable$ = this.someObservable$.pipe(
    switchMap(values => {
         return forkJoin(values
            .map(value => this.someService.getByName(value.name)));
    }
} // Returns an Array

From the service I’m getting {foo: ‘yay’, bar: ‘yayay’} but I’d like to add the value.name from ‘someObservable$’ so it looks in the end like this: {foo: ‘yay’, bar: ‘yayay’, searchTerm: ‘Car’}.

The interface already looks like this:

foo: string;
bar: string;
searchTerm: string;

What would be the way to achieve this? Took me already way to long to figure out the current code (still learning a lot about Observables/RxJS)

Solution

You can map the observable produced by the service:

observable$ = this.someObservable$.pipe(
  switchMap(values => forkJoin(
    values.map(value =>
      this.someService.getByName(value.name).pipe(map(data => ({
        ...data,
        searchTerm: value.name
      })))
    )
  ))
);