Cannot Pu sh Data Дети детей во вложенном массиве

Question

Итак, у меня есть следующий массив. Я могу сделать pu sh до уровня родителей и детей, но я не могу показать pu sh детям детей или глубже. Вот массив:

 TREE_DATA: SegmentCategory[] = [
    {
      id: 1,
      name: 'Category 1',
      children: [
        {
          id: 2,
          name: 'Category 1-1',
          children: [
            {
              id: 4,
              name: 'Category 1-1-a',
              children: []
            },
            {
              id: 5,
              name: 'Category 1-1-b',
              children: []
            },
          ]
        },
        {
          id: 6,
          name: 'Category 1-2',
          children: [
            {
              id: 7,
              name: 'Category 1-2-a',
              children: [
                {
                  id: 8,
                  name: 'Category 1-2-1',
                  children: [
                    {
                      id: 9,
                      name: 'Category 1-2-2-a',
                      children: []
                    }
                  ]
                }
              ]
            }
          ]
        }
      ]
    },
    {
      id: 10,
      name: 'Category 2',
      children: []
    }
  ];

А вот метод, который я использую для добавления данных в массив:

createCategory() {
    this.id++;

    if (this.formGroup.controls['parentCategory'].value == null) {
      this.TREE_DATA.push(
        {
          id: this.id,
          name: this.formGroup.controls['categoryName'].value,
          children: []
        });
    } else {
      this.TREE_DATA.forEach((v, index) => {
        if (v.id === this.formGroup.controls['parentCategory'].value.id) {
          this.TREE_DATA[index].children.push(
            {
              id: this.id,
              name: this.formGroup.controls['categoryName'].value,
              children: []
            }
          );
        }
      });
    }
  }

Я знаю, что могу просто добавить дополнительный foreach, однако это не Мне кажется, это не лучший способ справиться с этим, поскольку я мог бы в любой момент добавить go 5-6 слоев вниз, чтобы добавить нового вложенного потомка. Как лучше всего справиться с этим?

Answer 1

Вы можете взять рекурсивную функцию для поиска объекта в дереве.

function find(array, id) {
    var result;
    array.some(object => {
        if (object.id === id) return result = object;
        return result = find(object.children || [], id);
    });
    return result;
}

var data = [{ id: 1, name: 'Category 1', children: [{ id: 2, name: 'Category 1-1', children: [{ id: 4, name: 'Category 1-1-a', children: [] }, { id: 5, name: 'Category 1-1-b', children: [] }] }, { id: 6, name: 'Category 1-2', children: [{ id: 7, name: 'Category 1-2-a', children: [{ id: 8, name: 'Category 1-2-1', children: [{ id: 9, name: 'Category 1-2-2-a', children: [] }] }] }] }] }, { id: 10, name: 'Category 2', children: [] }];

console.log(find(data, 9));
console.log(find(data, 'unknown'));