How to flatten Array of Observables in an Observable

问题

I'm trying to flatten a nested Observable, but I'm not getting it to work:

 this.af.object('test/father')
  .map(res => {
    res.namedKeys = [];
    for (let el in res.keys) {
      res.namedKeys.push(this.af.object(`test/keys/${el}`))
    }
    return res
  })
  .flatMap(res => Observable.combineLatest(res))
  .subscribe(res => {
    console.log('The final response:', res);
  });

I want to get the actual data of the Observables in my Array. I've tried a lot of different things the last 2 days, but in the end, I receive either nothing or still the Array with Observables in it. The code above is returning nothing.

回答1:

It's pretty hard to see what is the problem , since you don't supply any structure info.

I think you mean :

 for (let el in Object.keys(res))

instead of

 for (let el in res.keys)

Also - combineLatest expects an observable. you didn't supply one :

Consider using this instead :

.flatMap(res => Rx.Observable.combineLatest(Rx.Observable.of(res)))

Demo ( which uses rxjs 5 which uses switchmap instead of flatMap)
http://jsbin.com/cuvisecipi/1/edit?html,js,console,output

A better demo which illustrates a similar ( from an array) solution :

http://jsbin.com/punoxitino/1/edit?html,js,console,output

回答2:

The .combineLatest operator would work but it expects an array of Observables. You're passing it an object res that contains a property with an array of Observables.

In other words .combineLatest needs this: Observable[]
But you're passing it: { namedKeys: Observable[] }

So you problem is not simply flattening Observables (like this eg. Combine multiple observable arrays into new object array) because you need to pass the original objects as well. I'd recommend using forkJoin because it collects all items from all source Observables until they complete.

this.af.object('test/father')
  .concatMap(res => {
    // the original object is here as well at index 0 
    observables = [ Observable.of(res) ]; 
    for (let el in res.keys) {
      observables.push(this.af.object(`test/keys/${el}`))
    }
    return Observable.forkJoin(observables);
  })
  .map(([res, ...namedKeys]) => {
    res.namedKeys = namedKeys;
    return res;
  })
  .subscribe(res => { ... });

来源：https://stackoverflow.com/questions/43652927/how-to-flatten-array-of-observables-in-an-observable

标签

angular

rxjs