从 Angular Component 和 Directive 的实例化,谈谈 Angular forRoot 方法的命令由来

举报
Jerry Wang 发表于 2023/01/05 10:58:17 2023/01/05
【摘要】 同 Angular service 的单例特性不同,Angular 组件和指令通常会被多次实例化,比如 HTML markup 中每出现一次 Component 的 selector,就会触发 Component 的一次实例化。这些 Component 和 Directive 的范围,仅限于导入它们的 NgModule,以防止命名冲突,例如两个组件可能具有相同的选择器。正是由于 Angula...

同 Angular service 的单例特性不同,Angular 组件和指令通常会被多次实例化,比如 HTML markup 中每出现一次 Component 的 selector,就会触发 Component 的一次实例化。

这些 Component 和 Directive 的范围,仅限于导入它们的 NgModule,以防止命名冲突,例如两个组件可能具有相同的选择器。正是由于 Angular 依赖注入 (DI) 行为的这种差异,需要将包含组件和指令的 NgModule 与包含组件、指令和 Providers 的 ModuleWithProviders 区分开来,这就是 forRoot() 方法的用武之地。

然而,依赖注入并不总是这么简单。 有时在引导过程中,所有应用程序的 NgModule 都不可用。延迟加载就是这样一个例子。当在路由期间延迟加载 NgModule 时,在延迟加载的 NgModule 中注册的 providers,提供程序及其子项在引导过程中不可用,此时 Angular 无法注册它们。 因此,它们仅在加载路由时才作为 providers 添加,而且它们的作用域是从延迟加载的 NgModule 及其子模块开始注入。

如果有多个延迟加载的 NgModule 尝试注册相同的提供程序,则 NgModule 树的每个节点都会以不同的实例结束。 通过在根目录导入提供程序,它有助于确保所有延迟加载的 NgModule 都获得相同的提供程序实例,这也是为什么 forRoot() 被这样命名的原因。

在这里插入图片描述

作为消费者,当应用层序里使用到的某个库依赖项需要一个延迟加载的 NgModule 时,就需要调用其 forRoot 方法。在应用程序的根目录导入模块并使用 forRoot() 方法注册,以全局导入提供程序。在其他 NgModules 中,当需要导入组件和指令时,使用适当的非根形式的导入。

在这里插入图片描述

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。