Looking to implement a nested *ngFor using Firebase data with angularFire2.
The data structure is as follows: https://i.sstatic.net/UG7ml.png
I aim to iterate through the first level of subjects list in one *ngFor, and then loop through the child level in a nested *ngFor.
<ion-list>
<ion-item *ngFor="let mainSubject of subjects | async">
{{mainSubject.name}}
<ion-list>
<ion-item *ngFor="let childSubject of mainSubject.subjects | async">
{{childSubject.name}}
</ion-item>
</ion-list>
</ion-item>
</ion-list>
Considering using the map operator from rxjs for list transformation:
this.db.list(`${this.mainSubjectsPath}`).map((value) => {
console.log(value);
// perform necessary transformations...
});
However, it seems like the map function isn't being called.
Any suggestions on how to approach this?
Thank you!