How to flatten Array of Observables in an Observable

Question

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.

Royi Namir · Accepted Answer · 2017-04-27 09:06:43Z

3

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

answered Apr 27, 2017 at 9:06

Royi Namir

149k145 gold badges502 silver badges833 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Benny Over a year ago

No, I wanna do something else. When I get the response, I wanna map a property of the response to a new Observable. And in the end I wanna just receive plain data. In The Moment I receive an Observable in my data.

Community · Accepted Answer · 2017-05-23 10:31:22Z

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 => { ... });

Collectives™ on Stack Overflow

How to flatten Array of Observables in an Observable

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related