ngModule中的entryComponents是什么?

ngModule中的entryComponents是什么?

我正在研究依赖于2的Ionic3应用程序。 所以纳入了新的ngModules介绍。 我正在添加我的app.module.ts。 下面

import { NgModule } from '@angular/core';
import { IonicApp, IonicModule } from 'ionic-angular';
import { MyApp } from './app.component';
import { Users } from '../pages/users/users';

@NgModule({
  declarations: [
    MyApp,
    Users
  ],
  imports: [
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    Users
  ]
})export class AppModule {}

entryComponents在这里做什么?

entryComponents在这里做什么? 组件已经在声明中定义。 那么有什么需要重复呢? 如果我不在这里包含组件,会发生什么?
回答:
Angular使用entryComponents来启用“树震动”,即只编译项目中实际使用的组件,而不是编译所有在ngModule中声明但从未使用的组件

这是用ViewContainerRef.createComponent()添加的动态添加的组件。将它们添加到entryComponents告诉脱机模板编译器编译它们并为它们创建工厂。

路由配置中注册的组件也自动添加到entryComponents,因为router-outlet也使用ViewContainerRef.createComponent()将路由组件添加到DOM。

离线模板编译器(OTC)只生成实际使用的组件。如果组件不直接用于模板,OTC不知道是否需要编译。有了entryComponents,你可以告诉OTC也编译这些组件,以便在运行时可用。

什么是入口组件? (angular.io)

NgModule文档(angular.io)

定义这个组件时定义应该被编译的组件。对于此处列出的每个组件,Angular将创建一个ComponentFactory并将其存储在ComponentFactoryResolver中。
如果你没有给entryComponents列出一个动态添加的组件,你会得到一个错误消息,因为Angular没有创建一个。

另见https://angular.io/docs/ts/la...

你不会比Angular文档得到更好的解释。
以下是角度文档的解释。

入口组件是根据类型强制加载的任何组件。
通过它的选择器声明式加载的组件不是一个入口组件。

大多数应用程序组件是声明式加载的。 Angular使用组件的选择器来定位模板中的元素。然后创建组件的HTML表示并将其插入选定元素的DOM中。这些不是条目组件。
一些组件只能动态加载,并不会在组件模板中引用

引导的根AppComponent是一个入口组件。确实,它的选择符匹配index.html中的元素标记。但是index.html不是组件模板,AppComponent选择器不匹配任何组件模板中的元素。

动态加载AppComponent,因为它是按照@ NgModule.bootstrap中的类型列出的,或者是通过模块的ngDoBootstrap方法强制性地加载。

路由定义中的组件也是条目组件。路径定义是指按其类型的组件。路由器忽略路由组件的选择器(如果它有一个),并动态地将组件加载到RouterOutlet中。
编译器无法通过在其他组件模板中查找这些条目组件来发现这些条目组件。您必须通过将它们添加到entryComponents列表来告诉它们。

Angular会自动将以下类型的组件添加到模块的entryComponents中:

@ NgModule.bootstrap列表中的组件。
路由器配置中引用的组件。
您不必明确提及这些组件,虽然这样做是无害的。

李胜松博客




lss博客
请先登录后发表评论
  • 最新评论
  • 总共0条评论