如何基于给定的对象在ngx-contextmenu中创建嵌套子菜单？

Question

我有一个文件夹的对象嵌套结构：

{
   "tree":[
      {
         "slug":"any",
         "title":"any",
         "children":[
            {
               "slug":"fff",
               "title":"fff",
               "children":[
                  {
                     "slug":"ppp",
                     "title":"ppp",
                     "children": []
                  },
                  {
                     "slug":"then",
                     "title":"then",
                     "children": []
                  }
               ]
            },
            {
         ],
         "expanded":true
      },
   ]
}

每个具有children属性的项目都是一个文件夹。应该这样显示：

我在项目中使用ngx-contexmenu。但是，如上例所示，生成嵌套的上下文菜单（因为每个级别都是使用此库的单独的上下文菜单）的问题在于，该库使用模板引用来添加上下文菜单项的子菜单。例如：

<ng-template contextMenuItem [subMenu]="saySubMenu">
  Say...
</ng-template>
<context-menu #saySubMenu>
  <ng-template contextMenuItem (execute)="showMessage('Hi, ' + $event.item.name)">
    ...hi!
  </ng-template>
</context-menu>

由于我需要每个子菜单（#saySubMenu）的参考名称，因此很难像给定对象那样动态地生成子菜单类型。我试图通过resolveComponentFactory创建每个子菜单，并动态设置引用名称，但是我想可能是不可能的。有人知道我该如何解决这个问题？