Angular 9 : 将数组对象重新排列为嵌套数组

Question

我正在尝试重新安排：

[
  {
    "id": 5,
    "levelName": "Level 1"
  },
  {
    "id": 6,
    "levelName": "Level 2"
  },
  {
    "id": 7,
    "levelName": "Level 3"
  }
]

收件人：

[
  {
    "id": 5,
    "levelName": "Level 1",
    "level": [
      {
        "id": 6,
        "levelName": "Level 2",
        "level": [
          {
            "id": 6,
            "levelName": "Level 2",
            "level": []
          }
        ]
      }
    ]
  }
]

我正在尝试制作树状结构 UI 布局。但我想知道如何实现转换数据部分。也许是一厢情愿，但有没有比循环内循环更简单的方法！？

Answer 1

您可以使用对象作为级别的映射来减少数组。

const arr = [ { "id": 5, "levelName": "Level 1" }, { "id": 6, "levelName": "Level 2" }, { "id": 7, "levelName": "Level 3" } ];
const res = arr.reduce((acc,obj)=>{
  let level = +obj.levelName.slice(obj.levelName.indexOf(' ') + 1);
  (acc[level] = acc[level] || []).push(obj);
  acc[level + 1] = acc[level + 1] || (obj['level'] = []);
  return acc;
}, {})[1];
console.log(res);

Angular 9 : 将数组对象重新排列为嵌套数组

Angular 9 : Rearrange array object into nested array

javascript

arrays

nested-loops

angular