CODEWITHSUNDEEP
javascriptangularrxjsobservableangular2-observables
Ryann Galea
Ryann Galea

Reputation: 307

Extracting multiple observables into an already mapped stream angular rxjs

Currently building a project in Firebase and Angular 4. I am pulling in an object of data which contains many keys of data, and a lot of different uid keys.

To keep the data somewhat manageable i don't want to save the object data inside some keys where it can be changed at the host.

In the instance i have the uid stored, i want to create a new key of the extracted observable. I can easily add it as an observable inside the mapped object but i want to actually extract the observable into the object during the stream. Here is what i currently have:

 this.ss.data()
  .map(res => {
    res['test1'] = this.fb.serie(res['serieUid']).map(res => res)
    return res
  })
  .subscribe(res => {
    console.log(res)
  })

  Result -
    serieUid:"-Kk1FeElvKMFcyrhQP4T"
    state:"Tennessee"
    test1:FirebaseObjectObservable
    timezone:"US/Eastern"

But i would like to have the extracted observable inside 'test1', I have failed on this for a few hours on this and am confused. There is more than one instance of a uid, so this was have to happen multiple times. Then subscribe.

Follow up after answered below:

Heres what i ended up with in my final function

getRound(roundUid: string) {

  /**
    Retrieves a round based simply on the uid
    supplied.
  **/

  return this.fb.round(roundUid)
    .mergeMap(round => // Get Serie Data
      this.fb.serie(round['serieUid']).map(serie => {round['serie'] = this.cs.cleanForFb(serie); return round})
    )
    .mergeMap(round => // Get Type Data
      this.fb.type(round['typeUid']).map(type => {round['type'] = this.cs.cleanForFb(type); return round})
    )
    .mergeMap(round => // Get sx Coast Data
      this.fb.coast(round['sxCoastUid']).map(sxCoast => {round['sxCoast'] = this.cs.cleanForFb(sxCoast); return round})
    )
}

Upvotes: 0

Views: 131

Answers (1)

martin
martin

Reputation: 96899

Try this. The mergeMap() operator subscribes to the internal Observable whose result is using map() turned into the original res updated with test1.

this.ss.data()
  .mergeMap(res => this.fb.serie(res['serieUid'])
    .map(innerRes => {
      res['test1'] = innerRes;
      return res;
    })
  )
  .subscribe(res => {
    console.log(res)
  })

Upvotes: 2

Related Questions