Q:

how i do infinity parent - child foreach loop in angular?

I want to do foreach for following json:-
const TREE_DATA: FoodNode[] = [
  {
    name: 'Fruit',
    children: [
      {name: 'Apple'},
      {name: 'Banana'},
      {name: 'Fruit loops'},
    ]
  }, {
    name: 'Vegetables',
    children: [
      {
        name: 'Green',
        children: [
          {name: 'Broccoli'},
          {name: 'Brussel sprouts'},
        ]
      }, {
        name: 'Orange',
        children: [
          {name: 'Pumpkins'},
          {name: 'Carrots'},
        ]
      },
    ]
  },
];

A:

You need use a recursive function
  showData(element,level,parent)
  {
    element.forEach(x=>
    {
      x.level=level
      x.parent=parent
      console.log(x.name,x.level,x.parent);
      if (x.children)
          this.showData(x.children,x.level+1,x.name)
    })
  }

You call as
  this.showData(TREE_DATA,0,null)    

See that we add two new properties to the data "level", and "parent" that we can use 

