有没有办法将组件作为Angular 2中DOM标签的子(而不是兄弟)动态插入?
有很多示例可以将动态组件作为给定ViewContainerRef
的标记的兄弟项插入,例如(对于RC3):
@Component({
selector: '...',
template: '<div #placeholder></div>'
})
export class SomeComponent {
@ViewChild('placeholder', {read: ViewContainerRef}) placeholder;
constructor(private componentResolver: ComponentResolver) {}
ngAfterViewInit() {
this.componentResolver.resolveComponent(MyDynamicComponent).then((factory) => {
this.componentRef = this.placeholder.createComponent(factory);
});
}
}
但这会生成类似于以下内容的DOM:
<div></div>
<my-dynamic-component></my-dynamic-component>
预期结果:
<div>
<my-dynamic-component></my-dynamic-component>
</div>
使用SomeComponent
的ViewContainerRef
具有相同的结果,它仍然将生成的组件作为兄弟项插入,而不是子项。我可以接受这样的解决方案:模板为空,并且动态组件被插入到模板中(在组件选择器标记内)。
当使用ng2-dragula这样的库从动态组件和benefit from the model updates列表中拖动时,DOM结构非常重要。额外的div在可拖动元素的列表中,但在模型之外,这打破了拖放逻辑。
有些人说这是不可能的(c.f. this comment),但这听起来像是一个非常令人惊讶的限制。
https://stackoverflow.com/questions/38093727
复制相似问题