Angular 角度8:如何使用多内容投影/多转置插槽两次? 我有一个角度8.2项目,有两种不同的显示模式(横向|纵向) 每个页面的顶部和底部都有一个工具栏,围绕着主要内容 菜单以及主内容都是特定于模块的,因此我使用的是插槽。换句话说:五个不同的可能父组件中有一个使用此组件,并使用提供主内容和(单独不同的)菜单 //第一 //第二 //肖像模式 ... 与上面非常相似,也有2个菜单,1个内容。。。 问题:如何使用插槽两次?**如果我使用例如。。。

Angular 角度8:如何使用多内容投影/多转置插槽两次? 我有一个角度8.2项目,有两种不同的显示模式(横向|纵向) 每个页面的顶部和底部都有一个工具栏,围绕着主要内容 菜单以及主内容都是特定于模块的,因此我使用的是插槽。换句话说:五个不同的可能父组件中有一个使用此组件,并使用提供主内容和(单独不同的)菜单 //第一 //第二 //肖像模式 ... 与上面非常相似,也有2个菜单,1个内容。。。 问题:如何使用插槽两次?**如果我使用例如。。。,angular,angular-content-projection,Angular,Angular Content Projection,…一个console.dir()向我显示了一个有效的ElementRef,但我无法在.html模板中输出它,即可能会有用 我的理解是,ng content并不创建内容,它只是将内容从一个部分移动到另一个部分 我认为解决您问题的方法是使用ng模板。例如: 投影组件 let实例=0; @组成部分({ 选择器:“应用程序已投影”, 模板:`projected instance nr:{{instanceId}}` }) 导出类ProjectedComponent实现OnInit{ instanceId

…一个
console.dir()
向我显示了一个有效的ElementRef,但我无法在.html模板中输出它,即

可能会有用

我的理解是,
ng content
并不创建内容,它只是将内容从一个部分移动到另一个部分

我认为解决您问题的方法是使用
ng模板
。例如:

投影组件
let实例=0;
@组成部分({
选择器:“应用程序已投影”,
模板:`projected instance nr:{{instanceId}}`
})
导出类ProjectedComponent实现OnInit{
instanceId:数字;
构造函数(){}
恩戈尼尼特(){
this.instanceId=++实例;
}
}
parent.component.ts
@组件({
选择器:“应用程序父级”,
模板:`
父组件
使用内容#1

使用内容#2

`, }) 导出类ParentComponent实现OnInit{
@ContentChild('content',{read:TemplateRef})content:TemplateRef

“将
ng模板
做得更高一级”-谢谢,这确实出色地解决了它!Thanxs堆!
A <ng-container *ngTemplateOutlet="menu"></ng-container> A
B <ng-container *ngTemplateOutlet="menu"></ng-container> B
   @ViewChild('menu', {static: true}) menuA: TemplateRef<any>;