5

我正在为我的一个项目实施动态组件。动态组件的概念是一旦需要它们就会进入内存，并且在任何模板中都没有引用。

根据官方文档，我们声明这些组件是entryComponents为了防止它们在摇树过程中被丢弃，因为它们没有模板引用。

以下是app.module.ts我在数组中声明两个动态组件SlideOneComponent的位置：SlideTwoComponententryComponents

  @NgModule({
  declarations: [
    AppComponent,
    ButtonComponent,
    AdDirective
  ],
  imports: [
    BrowserModule
  ],
  providers: [],
  entryComponents: [
      SlideOneComponent,
      SlideTwoComponent,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

上面app.module.ts我收到以下错误：

在此处输入图像描述

一旦我将两个动态组件添加到declarations数组中，上述错误就会消失。上述官方文档还说，我们不需要声明可从entryComponents或组件访问的bootstrap组件。我也访问了这个答案，但这似乎并不令人满意，因为它参考了 Ionic。

请帮助我知道我在哪里失踪。提前致谢！:)

4

1 回答 1

1

正如这句话中所见（在字里行间阅读时）：

尽管 @NgModule 装饰器有一个 entryComponents 数组，但大多数时候您不必显式设置任何入口组件，因为 Angular 会自动将 @NgModule.bootstrap 中列出的组件和路由定义中的组件添加到入口组件中。

您将常用组件隐式添加到 EntryComponents 数组，这意味着它们被添加到两个数组中 - Declarations 和 EntryComponents （而您仅在 Declarations 数组中添加了它）。因此，您还必须将动态组件显式添加到两个数组中。

声明的目的是使指令（组件等）可用于模块中的其他类，并将其选择器与 HTML 匹配。

EntryComponents告诉 Angular 创建一个 componentFactory，它是由编译器根据您在@Component装饰器中提供的元数据创建的，因此您以后可以在createComponent().

正如所见，这两个数组的用途非常不同，并且两者都是创建组件所必需的。如果组件不是动态创建的，编译器会读取它的元数据并创建一个componentFactory，但是编译器不知道动态组件，所以你必须在它运行之前通知它动态组件，因为他只运行一次 - 在编译时:)

于 2018-10-15T05:05:02.920 回答