如何从 firebase 获取嵌套的 json 数据？

Question

I want to create a dropdown menu from data that is coming from realtime database. I have written few lines of code but not able to get subcategory created an interface

export interface MenuInfo {
  name: string;
  subcategory?: MenuInfo[];
}

  menuList: MenuInfo[] = [];

  constructor(public dataService: DataService) {}

  ngOnInit() {
    this.getMenuList();
  }

  getMenuList() {
    this.dataService.getMenuList().subscribe(data => {
      this.menuList = this.dataService.snapShotToArray(data);
      console.log("menulist"+ this.menuList[0].subcategory);
    });
  }

  getMenuList() {
    return this.fdb.list('category').snapshotChanges();
  }

  snapShotToArray(snapShot) {
    let retArr: any[] = [];
    snapShot.forEach(element => {
      let obj: any = {};
      obj = element.payload.val();
      obj.key = element.key;
      retArr.push(obj);
    });

    return retArr;
  }

This is json data from firebase.

category
   -LtygKwodI5HdptwuInj
     name: "Helmet"
     subcategory
       -LtygbtNUgCPC4paDswy
          name: "full-face"

How should i do to create dropdownmenu.

Answer 1

After retrieving the key add a reference to node subcategory , subscribe to the observable and then using forEach you can access the value of name inside subcategory:

snapShot.forEach(element => { 
  let lists = this.fdb.list("category/"+element.key+"/"+"subcategory").snapshotChanges();
  lists.subscribe(data => { 
    data.forEach(subElem => {
      console.log(subElem);
  });
 });
});