CODEWITHSUNDEEP
firebaseangularfire2
mario
mario

Reputation: 112

Firebase / Angularfire2: nested data nodes in firebase

i've got a firebase database. a node called /config// which holds userspecific data. i now want to add a subtree to the userdata with a list of cars, like /config//cars/:

"config" : {
    "NE5AwHcxKofMPKRCAvny5Re4MtG3" : {
      "geburtstag" : "2017-06-04",
      "nachname" : Mueller",
      "cars" : {
        "-Krr2-DC1uoqCvgVJhFL" : {
          "name" : "Ford Mustang"
        },
        "-Krue4_5kJQhis-3Qg1X" : {
          "name" : "Toyota Supra"
        }
      }
    }

i created a observable binding to /config/ 

this.$ref = this.database.object('/config/' + uid);
this.data = this.$ref.subscribe();

i can access the data of the main config-node and bind it with angular, but a ngFor on the Cars subnode doesn't work. Am i structuring my data wrong or do I need some kind of mapping here?

the html part:

<ion-item *ngFor="let car of data.cars | async">
    {{car.name}}
 </ion-item>

Upvotes: 0

Views: 391

Answers (1)

Will
Will

Reputation: 2673

You're assigning data to your subscription while you should be assigning it to the observable:

cars: FirebaseListObservable<any[]>;
this.cars = this.database.list(`/config/${uid}/cars`);

Now you can call your async data in your ngFor loop:

<ion-item *ngFor="let car of cars | async">
  {{ car.name }}
</ion-item>

Upvotes: 1

Related Questions