NGRX标准化sidenav路由树

如何解决NGRX标准化sidenav路由树

在我的应用程序中，我有一个sidenav。目前，此结构在json文件中定义，但稍后可能会通过网络服务（基于角色）进行提供。加载应用程序时，我将sidenav加载到resolve中，并将其置于存储状态（sidenav状态扩展实体状态）。

我有一个为导航项定义的模型来映射json对象（简化）：

export interface NavItem {
  label: string;
  route: string;
  hidden?: boolean;  // for routes that should not be displayed in the sidenav
  children?: NavItem[]
}

假设以下结构：

{
  "NavItems": [
    {
      "label": "Home","route": "home"
    },{
      "label": "Feature1","route": "feature1","children": [
        {
          "label": "1a","route": "feature1/1a"
        },{
          "label": "1b","route": "feature1/1b"
        },{
          "label": "1c","route": "feature1/1c","hidden": true
        },]
    },{
      "label": "Feature2","route": "feature2","children": [
        {
          "label": "2a","route": "feature2/2a"
        },{
          "label": "2b","route": "feature2/2b"
        }
      ]
    }
  ]
}

在加载并将其置于状态时，它当然只会导致2个实体（feature1和feature2）。

这显然会破坏拥有实体状态的目的，但也有实际意义。例如，我突出显示了活动路线，但是对于隐藏的路线，我想突出显示最接近的父路线。我确实从路由器状态获取了路由，但是在没有允许嵌套的逻辑的情况下无法直接获取相应的导航项。

我希望能够按原样保留json结构（像树一样），因为这样写起来更加直观（除了使组件中的迭代更加容易）。

我应该怎么做？在加载json /为sidenav组件选择数组时，是否需要某种类型的normalized model来规范化/去规范化上述模型的状态？