ngTemplateOutlet递归的问题

今天尝试通过 ng-template 加 ngTemplateOutlet实现一个递归的菜单。但是遇到一个问题:NullInjectorError: No provider for NzMenuDirective!
即zerro的指令找不到。如果把zerro的指令去掉就可以正常显示。原以为是zerro的模块没导入,但是尝试不用ng-template,而是直接写‘nz-menu-item’就可以成功显示zerro的菜单。

最终得出结论,zerro和ngTemplateOutlet不能结合使用。递归应该用组件,不应该用ngTemplateOutlet

参考:

 https://github.com/NG-ZORRO/ng-zorro-antd/issues/3490#issuecomment-495630765

https://github.com/angular/angular/issues/14842

<ng-container *ngTemplateOutlet="menuItemNode; context: {menus_:menus}"></ng-container>

<ng-template #menuItemNode let-theMenus="menus_">
  <ng-container *ngFor='let menu of theMenus'>
    <li *ngIf='menu.childrens.length==0' nz-menu-item>
      <span title>
        <i type="mail"></i>
        <span>{{menu.resourceName}}</span>
      </span>
    </li>
    <li *ngIf='menu.childrens.length!=0'>
      <span title>
        <i type="appstore"></i>
        <span>{{menu.resourceName}}</span>
      </span>
      <ul style="padding-left: 5px">
        <ng-container *ngTemplateOutlet="menuItemNode; context: {menus_:menu.childrens}"></ng-container>
      </ul>
    </li>
  </ng-container>
</ng-template> 
原文地址:https://www.cnblogs.com/yoyogis/p/10988260.html