Angularfire Nesting

Ionic Framework ionic-v3
1

Hi Experts,

Below is the structure of my classes inside firebase:

{
  
  "groups" : {
    "-KjkdYVP3N69GaDfLwS1" : {
      "groupname" : "Ballet Class",
      "description" : "8 years onwards",
      "picture" : "assets/img/dance.jpg",
      "type" : "dance"
    },
    "-KjkdYVP3N69GaDfLwS2" : {
      "groupname" : "Ballet Class",
      "description" : "8 years onwards",
      "picture" : "assets/img/dance.jpg",
      "type" : "dance"
    },
    "-KjkdYVP3N69GaDfLwS3" : {
      "groupname" : "Ballet Class",
      "description" : "8 years onwards",
      "picture" : "assets/img/dance.jpg",
      "type" : "dance"
    },
    "-KjkdYVP3N69GaDfLwS4" : {
      "groupname" : "Ballet Class",
      "description" : "8 years onwards",
      "picture" : "assets/img/dance.jpg",
      "type" : "dance"
    }
  },

  "linking" : {
    "DCuf5MvTlpQa0LC4BoJWedIiFfc2" : {
      "groupid" : {
        "-KjkdYVP3N69GaDfLwS1" : true,
        "-KjkdYVP3N69GaDfLwS2" : true,
        "-KjkdYVP3N69GaDfLwS3" : true,
        "-KjkdYVP3N69GaDfLwS4" : true
      },
      "memberid" : {
        "-KjkdduprKpr8e0P7KH1" : true,
        "-KjkdduprKpr8e0P7KH2" : true,
        "-KjkdduprKpr8e0P7KH3" : true,
        "-KjkdduprKpr8e0P7KH4" : true

      },
      "role" : "admin",
      "uid" : "DCuf5MvTlpQa0LC4BoJWedIiFfc2"
    }
  },
}

I have 2 classes ‘linking’ and ‘groups’. Once user logs in, i want to fetch the details of the user groups from the linking table and further want to fetch group details on the basis of group id’s return by first query. I write both of these queries independently:

Fetching groups from linking class:-
this.groupid = this.af.database.list(’/linking/’+uid +'groupid);

Fetching details of the groups:
this.groupdetails = this.af.database.list(’/groups’+this.groupid);

But i know this code is not valid.

Can someone please suggest right way to handle this requirement?

I ultimately want to display group details on a page

<li  *ngFor="let group of groups| async">
               {{ (group.data | async)?.field }}
2

You would actually just use this.af.database.list('/groups') to get the list of groups. Each item in the list will have a $key property which is what I think you are referring to in your post as id. (The key is a string like -KjkdYVP3N69GaDfLwS3.)

The documentation for AngularFire 2 is here if you haven’t seen it.

3

Thanks. But i only want to list those groups in which user has subscribed himself and that data is present in linking class.

4

I would think critically about how to organize your data in Firebase in this case. You should probably copy the information you need about a user’s groups down to a path under their own user object. When I came to firebase I had a normalized relational database approach and it’s the wrong approach. If you browse the firebase documentation there is a lot of helpful discussion about how to denormalize your data for firebase and save yourself from complex, high overhead querying.

5

Three Firebase locations:

  1. Simple user data (no lists or arrays). Name, photo avatar url, etc. Also includes a unique user ID.

  2. Subscription to groups for User X. A list of strings. Each string is the unique ID of a group.

  3. Profile of group. Indexed by unique group ID.

1 and 3 are flat. 2 is not flat, but reading each item in the list is inexpensive. Use Firebase database rule to index (3) by unique group ID, so the query from 2 to 3 is fast.

6

This makes sense. But in this case if i want to get the details of all the groups to which user has subscribed, in that case i will have to use “Foreach” clause. Is it the right approach to handle this kind of data? Can you suggest a code snippet which can use Foreach to fetch all the subscribed group details.

Thanks.

7

Your question is not a simple one to answer. It depends how many groups a user can subscribe to, and how complex the info of each group is. A chat menu or email inbox stores flat data (like the first line of the message and the avatar of the sender) of the last ten messages. Then if the user puts a message into focus, it loads the entire message, which could be long, with attached photos, i.e., an expensive database query. So maybe you want something like that, depending on how expensive it is to get a group’s info.

8

I would recommend reading this article from the Firebase documentation. I think that this is a great approach to follow.