angular angularfire2 simple join

Question

i'm trying to create a post-comment relationship where the a user can write a post and others users can comment on the post.

I can show the posts but when in trying to do the join for displaying the comments that belongs to the post i cant.. below is my db schema

firebase db

i was thinking that first i need to get the key from the posts node and then move to comments and somehow get the comments of each post.. and use it in *ngfor inside the ngfor of the post?

i was trying something like

findAllComments(){

   this.db.list('posts', { preserveSnapshot: true})

    .subscribe(snapshots=>{
        snapshots.forEach(snapshot => {
          return this.db.list(`comments/${snapshot.key}`)
        });

    });
}

but this returns void of course:

When I console.log:

findAllComments(){

   this.db.list('/posts', { preserveSnapshot: true})

    .subscribe(snapshots=>{
        snapshots.forEach(snapshot => {
            const kapa = this.db.list(`comments/${snapshot.key}`).do(console.log)
            kapa.subscribe();
        });
    });
 }

I get in console this

console.log

I'm not sure if my thinking on this is right.

I'm confused because I am new in angular and firebase.

Kato Kato · Accepted Answer · 2017-12-21T19:44:40

You aren't returning a subset of posts (you're querying on all posts) so there's no need to have a join of any sort here. You can just query for all comments:

findAllComments(){
  // {preserveSnapshot: true} is deprecated
  return this.db.list('/comments').snapshotChanges(); 
}

Assuming you actually want to retrieve a subset of comments (not what your example depicts), you could do something like this:

this.replies = db.list('AngularFire/joins/messages').snapshotChanges().map(snapshots => {
  console.log('snapshots', snapshots);
  return snapshots.map(ss => {
    return db.list(`AngularFire/joins/replies/${ss.key}`).valueChanges();
  });
});

There is a complete working example of the latter here.

angular angularfire2 simple join

2 Answers