我正在尝试将组件动态插入到自定义模态窗口组件中
我的模态组件接收到一个 html 文件的 URL,其中包含一个组件:
<a modal bodyUrl="/some/path/body.html">
正文.html:
<hello-component></hello-component>
我正在通过 http 将 body.html 的内容加载到模态的 DOM 中,并通过 htmlBinding 属性将其插入到模板中。
但是,我的组件不会呈现。有没有办法强制重新渲染?或者类似的东西?
感谢您的帮助!
更新 1:
下面的两个答案让我想到了将组件类型作为模态输入传递并使用 DynamicComponentLoader 来引导组件
这里有一些概念:
最佳答案
您需要使用 DynamicComponentLoader
而不是 innerHTML
属性。在这种情况下,组件将被编译并添加到模板中。
这是一个示例:
@Component({
selector: 'my-app',
template: 'Parent (<child id="child"></child>)'
})
class MyApp {
constructor(dcl: DynamicComponentLoader, injector: Injector) {
dcl.loadAsRoot(ChildComponent, '#child', injector);
}
}
有关详细信息,请参阅此链接:
关于Angular 2 Modal Service插入动态(未知)组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37259957/