accessing nested json array using angular - arrays

Question

I am trying to access the nested tree view of child item from json array.I am facing difficulties in accessing multiple children from the below complex json,have been stuck with it for days....can anyone help me how to access all children using angular or through java script,Also how can i know that which children belong to which parent.I was only able to get the child of first parents by trying out the below code:
here the json is assigned to value=datasource.data;
this.dataSource.data.forEach((item,i)=>{
console.log(item.children);
if(item.children){
item.children.forEach((childItems,i)=>{
console.log(childItems);
})
}
Here is the json :
TREE_DATA: FoodNode[] =
[
{
name: 'Dashboard',
id: "0",
startButton: "enabled",
stopButton: "enabled",
type: "ec2",
children: [
{
name: 'Backend-Server',
id: "1",
startButton: "enabled",
stopButton: "enabled",
type: "ec2",
children: [
{
startButton: "disabled",
stopButton: "enabled",
type: "ec2",
name: 'Backend-Server-1',
id: "3"
},
{
startButton: "enabled",
stopButton: "disabled",
type: "ec2",
name: 'Backend-Server-2',
id: "4"
},
]
},
{
startButton: "enabled",
stopButton: "disabled",
type: "rds",
name: 'Frontend-Server',
id: "5"
},
{
startButton: "enabled",
stopButton: "enabled",
type: "ec2",
name: 'Backup-Server',
id: "6"
},
]
},
{
name: 'Admin',
id: "7",
startButton: "enabled",
stopButton: "disabled",
type: "ec2",
children: [
{
name: 'Backend-Server',
id: "8",
startButton: "enabled",
stopButton: "disabled",
type: "ec2",
children: [
{
startButton: "enabled",
stopButton: "disabled",
type: "ec2",
name: 'Backend-Server-1',
id: "9"
},
{
startButton: "enabled",
stopButton: "disabled",
type: "ec2",
name: 'Backend-Server-2',
id: "10"
},
]
}, {
startButton: "enabled",
stopButton: "disabled",
type: "ec2",
name: 'Frontend-Server',
id: "11",
children: [
{
startButton: "enabled",
stopButton: "disabled",
type: "ec2",
name: 'Frontend-Server-1',
id: "12",
},
{
startButton: "enabled",
stopButton: "disabled",
type: "ec2",
name: 'Frontend-Server-3',
id: "13"
},
]
},
]
},
]

Answer 1

The json you have is a nested json.We need to call recursive function for it.The below solution might help your problem
var childItem=[];
function getChildren(data){
data.forEach((each)=>{
if(each.children){
getChildren(each.children);
}else{
childItem.push(each);
}
});
}
getChildren(this.dataSource.data);
console.log(childItem);

Answer 2

Since you have a tree structure of children You need to use recursion
const { data } = this.dataSource;
var children=[];
function getChildNodes(data){
data.forEach((child)=>{
child.children)? getChildNodes(child.children): childrens.push(child);
});
}
getChildNodes(data);
console.warn(children);