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>
ngTemplateOutlet递归的问题的更多相关文章
- .NET 基础 一步步 一幕幕[面向对象之方法、方法的重载、方法的重写、方法的递归]
方法.方法的重载.方法的重写.方法的递归 方法: 将一堆代码进行重用的一种机制. 语法: [访问修饰符] 返回类型 <方法名>(参数列表){ 方法主体: } 返回值类型:如果不需要写返回值 ...
- 算法笔记_013:汉诺塔问题(Java递归法和非递归法)
目录 1 问题描述 2 解决方案 2.1 递归法 2.2 非递归法 1 问题描述 Simulate the movement of the Towers of Hanoi Puzzle; Bonus ...
- Android 算法 关于递归和二分法的小算法
// 1. 实现一个函数,在一个有序整型数组中二分查找出指定的值,找到则返回该值的位置,找不到返回 -1. package demo; public class Mytest { public st ...
- 二叉树的递归实现(java)
这里演示的二叉树为3层. 递归实现,先构造出一个root节点,先判断左子节点是否为空,为空则构造左子节点,否则进入下一步判断右子节点是否为空,为空则构造右子节点. 利用层数控制迭代次数. 依次递归第二 ...
- 递归实现n(经典的8皇后问题)皇后的问题
问题描述:八皇后问题是一个以国际象棋为背景的问题:如何能够在8×8的国际象棋棋盘上放置八个皇后, 使得任何一个皇后都无法直接吃掉其他的皇后?为了达到此目的,任两个皇后都不能处于同一条横行.纵行或斜线上 ...
- C语言用分别用递归和循环求数字的阶乘的方法
以下代码均为 自己 实现,嘻嘻! 参考文章:http://blog.csdn.net/talk_8/article/details/46289683 循环法 int CalFactorial(int ...
- C#递归解决汉诺塔问题(Hanoi)
using System;using System.Collections.Generic;using System.Linq;using System.Text; namespace MyExamp ...
- Java之递归求和的两张方法
方法一: package com.smbea.demo; public class Student { private int sum = 0; /** * 递归求和 * @param num */ ...
- C#语言基础——递归
递归 一.概念conception: 函数体内调用本函数自身,直到符合某一条件不再继续调用. 二.应满足条件factor: (1)有反复执行的过程(调用自身): (2)有跳出反复执行过程的条件(函数出 ...
随机推荐
- webpack4+vue打包简单入门
前言 最近在研究使用webpack的使用,在查阅了数篇文章后,学习了webpack的基础打包流程. 本来就可以一删了之了,但是觉得未免有点可惜,所以就有了这篇文章,供大家参考. webpack打包的教 ...
- Python 如何用列表实现栈和队列?
1.栈结构,其实就是一个后进先出的一个线性表,只能在栈顶压入或弹出元素.用列表表示栈,则向栈中压入元素,可以用列表的append()方法来实现,弹出栈顶元素可以用列表的pop()方法实现. >& ...
- loli的测试-2018.12.9
模拟赛-2018.12.9 这是NOIP之后第一次模拟赛...但是考的比较悲惨. 非常喜欢写考试总结,不知道为什么... T1:https://www.luogu.org/problemnew/sho ...
- angularJS(一):表达式、指令
简介 以 JavaScript 编写的库,是一个 JavaScript 框架 一.表达式 AngularJS 使用 表达式 把数据绑定到 HTML. 表达式写在双大括号内:{{ expression ...
- Excel如何通过关键字模糊匹配查找全称
打开excel,以其素材为例,通过关键字模糊匹配查找全称. 在公司名下输入公式:=LOOKUP(1,0/FIND(D2,A2:A5),A2:A5),按回车键确定即可. FIND(D2,A2:A ...
- 【学习总结】快速上手Linux玩转典型应用-第5章-远程连接SSH专题
课程目录链接 快速上手Linux玩转典型应用-目录 目录 1. 认识SSH 2. 服务器安装SSH服务 3. 客户端安装SSH工具 4. 客户端链接SSH服务 5. SSH config 6. SSH ...
- k3 cloud的单据存储在业务对象表中
k3 cloud的单据存储在业务对象表中,表名为T_META_OBJECTTYPE,查询表名和对应的表: select FNAME,FBASEOBJECTID from T_META_OBJECTTY ...
- router4.0
https://blog.csdn.net/sinat_17775997/article/details/69218382 React Router 4.0 实现路由守卫 https://www. ...
- qt04 中文显示问题
sockettools识别GB2312,接收qt server 数据时 QByteArray ba = str.toLocal8Bit(); char *ss = ba.data(); obj-> ...
- Eclipse开发工具的编码问题
乱码:文件有一个编码,打开文件的工具(Eclipse或者浏览器)有一个编码,当两个编码不同就会出现编码异常或乱码. 参考: Eclipse修改编码格式 背景:在Eclipse的开发使用中,我们经常使用 ...