嵌套数组上的AngularTS递归过滤器答案

【问题标题】：AngularTS recursive filter on nested array嵌套数组上的AngularTS递归过滤器
【发布时间】：2018-10-16 11:13:16
【问题描述】：

我有一个问题，它需要一个函数，该函数可以递归地遍历对象的嵌套数组并根据它们是否存在于视图列表中来过滤元素。

例如，给定一个列表：

[{
    "label": "Heading",
    "items": [{
      "label": "Subheading",
      "items": [{
          "id": "item1_priv",
          "label": "item1"
        },
        {
          "id": "item_priv2",
          "label": "item2"
        },
        {
          "label": "Subheading",
          "items": [{
            "id": "item_priv3",
            "label": "item3"
          }]
        }
      ]
    }]
  },
  {
    "label": "Heading2",
    "items": [{
      "label": "Subheading",
      "items": [{
          "id": "item_priv4",
          "label": "item4"
        },
        {
          "id": "item_priv5",
          "label": "item5"
        }
      ]
    }]
  }
]

以及视图列表：

canView = ['item1','item2','item4','item5']

该函数需要过滤掉列表中的item3，因为它不在canView中。

我已经做了一个函数：

public filterView(list: any[]): any {

  for (const item of list) {
    if (item.items) {
      item.items = this.filterView(item.items);
    } else {
      list = ((list.filter((i: any) => this.hasView(i.id))));
    }
  }

  return list;
}

但是，我的问题是：是否可以使用 list.filter() 将此函数重写为 lambda？我是 Angular to 和 Typescript 的新手，所以我很难用过滤器（或嵌套过滤器）来绕开我的脑袋，以便根据它是否拥有项目来遍历列表。

我的假设是一个函数

list.filter(item => return(item.items && this.hasView(item.items.id)))

但这似乎不适用于具有动态深度的列表。任何建议都会受到赞赏，因为我见过的类似问题的其他解决方案只有具有固定深度的列表。

【问题讨论】：

hasView 预计会返回什么？
hasView 根据项目的 id 是否存在于 canView 列表中返回一个布尔值。

标签： angular typescript recursion lambda filter

【解决方案1】：

我建议的唯一更改是进行一次列表过滤，而不是在循环内：

public filterView(list: any[]): any {

  for (const item of list) {
    if (item.items) {
      item.items = this.filterView(item.items);
    }
  }

  return list.filter((i: any) => this.hasView(i.id));
}

除此之外，鉴于filterView 正在做两件不同的事情（过滤顶级列表和改变后代的子列表），在我看来，任何更简洁的编写方式都会变得更加困难理解。

【讨论】：