Angular 4 mergeMap issue
I am working with a corner fire and I need to "attach" two nodes to a key. this is my method:
mergetest(userkey){
return this.db.list(`userOwnHangouts/${userkey}`)
.mergeMap((hangouts) => {
console.log('the merge hangout: ', hangouts.$key) //undefined
return this.db.list(`hangoutInterestedUsers/${hangouts.$key}`)
})
.subscribe(x => console.log('subscribe: ', x))
}
as you can see when i try to get the key $ it is undefined. although if I only register hangouts I get an array of objects.
how can I use mergeMap to return a single observable that includes BOTH the results of the first query and the second query? in this case, the video meetings themselves and the users they own?
in the console I get:
these are the 2 nodes I want to join:
@Maximus this is the result I am getting, can I get all the objects in the array to use with ngFor? [! [enter image description here] [4]] [4]
source to share
This should work in general:
return this.db.list(`userOwnHangouts/${userkey}`)
// flattening the array returned by `list()`
.mergeMap((o) => {
return o;
})
.mergeMap((o) => {
return this.db.list(`hangoutInterestedUsers/${o['$key']}`).map((users) => {
return {...o, users: users};
});
})
.reduce((acc, v) => {
acc.push(v);
return acc;
}, [])
.subscribe(x => console.log('subscribe: ', x))
}
Edit:
But since both are this.db.list
never completed, we cannot use reduce
here. It also forkJoin
won't work for the same reason. So the way is combineLatest
:
this.db.list(`userOwnHangouts/${userkey}`)
.switchMap((list: any[]) => Rx.Observable.combineLatest(
list.map((item: any) => this.db.list(`hangoutInterestedUsers/${item['$key']}`)),
(...results: any[][]) => {
list.forEach((item: any, index: number) => {
item["users"] = results[index];
});
return list;
}
))
.subscribe(x => console.log('subscribe: ', x))
source to share