我试图创建一个插件，将一个组件作为参数，并在body标签的末尾呈现其内容 . 就像使用jQuery的插件一样 .
@Component({
selector: 'some-selector',
template: 'This is FirstComponent'
})
class FirstComponent{}
@Component({
selector: 'app',
template: 'The root component'
})
class AppComponent{
// ImaginaryModalOpener is what i want to achieve.
// a standalone function that can take a component and render it in dom
// at the bottom of the body tag
ImaginaryModalOpener(FirstComponent);
}
我已经看到很多关于渲染动态组件的stackoverflow问题，但是他们在根组件中使用指令或HTML标记开始 . 在我的例子中，Root模板没有ImaginaryModalOpener的指令或组件 .
请指出我是否错过了什么 .
1 回答
从
AppComponenthow to get root viewContainerRef of angular2 aplication获取ViewContainerRef并向
ViewContainerRef添加一个组件，例如Angular 2 dynamic tabs with user-click chosen components中所示添加的组件将作为兄弟添加到
AppComponent. 如果AppComponent是<body>的子项，则动态添加的组件也将是<body>的子项 .