Angular 2 动态引导应用程序组件答案

【问题标题】：Angular 2 Dynamically bootstrap app componentsAngular 2 动态引导应用程序组件
【发布时间】：2016-12-13 14:29:18
【问题描述】：

是否可以根据元素是否存在动态引导应用程序组件。

想要类似...

export class AppModule { 

constructor() {

}   

ngDoBootstrap(appRef: ApplicationRef) {
    for(let component of components) {
       if(document.querySelector(component.selector)){
           appRef.bootstrap(component);
       }
    }
}

}

【问题讨论】：

标签： javascript angular typescript

【解决方案1】：

不，您需要自行检查该元素是否在 DOM 中可用，然后调用 platformBrowserDynamic().bootstrapModule(AppModule); 或 appRef.bootstrap(component); 或者跳过调用它。

另见https://github.com/angular/angular/issues/11730#issuecomment-252677321

【讨论】：

因此无法以某种方式查看导入的组件并在循环中检查那里的选择器。我问这个问题的原因是可能有超过 50 个组件，这当然会使我的应用程序模块文件看起来一团糟，也使以后的维护变得更加困难。
不确定你的意思。您可能会引导超过 50 个组件？
@Johnwilliams 您可以使用与您在@NgModule entryComponents: [components] 中声明的相同的数组
我如何从我的班级访问？
这是相当多的工作，你的问题很模糊。老实说，我不知道您要解决的问题到底是什么。我需要折磨我的大脑才能找到一个合理的场景，我可以举个例子;-)如果你能详细说明你的方法和你卡在哪里然后指出什么不能工作或使其工作缺少的东西。