关于 Angular Lazy loaded modules 中的 providers

简介: 关于 Angular Lazy loaded modules 中的 providers

懒加载模块中提供的注入标记对于根应用程序中提供的服务是不可见的。这尤其适用于多提供者标记,例如HttpInterceptors、各种处理程序等等。


为了减轻这个缺点,一些可组合的商店功能,例如PageMetaService(它使用PageMetaResolver标记)或ConverterService(它主要使用适配器序列化器和规范化器),在底层使用统一的注入器。通过这样做,它们可以访问懒加载模块中的标记,并可以利用它们来实现全局功能。


对于不依赖于统一注入器的机制(例如,大多数非可组合的商店库提供的功能,例如核心Angular库),建议您始终使用这些类型的标记来 eager 加载模块。


懒加载模块是Angular应用中的一个重要概念,它允许我们将应用程序拆分成多个模块,以便在需要时动态加载。这可以显著减少初始加载时间,并提高应用程序性能。然而,在使用懒加载模块时,我们需要注意一些特殊情况,尤其是在处理提供者和注入标记时。


提供者是Angular应用中的关键组件,它们用于依赖注入,让我们能够轻松地在各个部分之间共享数据和功能。然而,当我们将提供者定义在懒加载模块中时,需要注意一个重要的细节:这些提供者的注入标记(Injection Token)在根应用程序中是不可见的。这意味着,如果我们在根应用程序中有一些服务需要使用这些标记,它们将无法访问懒加载模块中的提供者。


这个问题特别适用于那些使用多提供者标记的情况,比如HttpInterceptors。HttpInterceptors是用于拦截HTTP请求和响应的Angular功能,它们通常被定义为提供者,并在应用程序的根模块中注册。然而,如果您的应用程序包含懒加载模块,并且这些模块定义了自己的HttpInterceptors,那么根模块中的HttpInterceptors将无法访问这些懒加载模块中的标记。


为了解决这个问题,Angular引入了统一注入器的概念。统一注入器是一个机制,它允许懒加载模块中的提供者和注入标记在全局范围内可见。这意味着,即使您的提供者定义在懒加载模块中,它们仍然可以被根应用程序中的其他服务所访问。这一机制的一个典型应用是PageMetaService和ConverterService。


PageMetaService是一个可组合的商店功能,它用于管理页面的元信息。它使用PageMetaResolver标记来解析页面元信息。由于PageMetaService使用统一注入器,它可以访问懒加载模块中的PageMetaResolver标记,从而使元信息的管理成为可能。


另一个例子是ConverterService,它主要用于序列化和规范化数据。它通常需要访问适配器序列化器和规范化器,这些也可能是懒加载模块中的提供者。然而,由于ConverterService使用了统一注入器,它可以轻松地访问这些标记,并将它们用于数据转换。


然而,并非所有功能都依赖于统一注入器。许多Angular核心库和非可组合的商店库可能不会使用这一机制。对于这些情况,建议始终使用急加载模块来定义提供者和注入标记。急加载模块会在应用程序启动时立即加载,因此它们的提供者和标记将在整个应用程序中可见。


总之,懒加载模块是Angular应用程序中提高性能和模块化的强大工具,但在处理提供者和注入标记时需要谨慎。通过了解统一注入器的概念,并在适当的情况下使用它,可以确保您的应用程序能够顺利运行,无论是否使用懒加载模块。这可以帮助您更好地组织和管理您的应用程序,提高其可维护性和性能。


相关文章
|
15天前
|
测试技术 开发者
Angular Custom Providers 的一个具体例子讲解
Angular Custom Providers 的一个具体例子讲解
21 2
|
6月前
|
Web App开发 前端开发 JavaScript
Angular 应用实现 Lazy Load(懒加载)的项目实战经验分享
Angular 应用实现 Lazy Load(懒加载)的项目实战经验分享
53 0
|
7月前
|
设计模式 SQL 关系型数据库
Proxy Facade 在 Angular 应用 Lazy Load 中的作用
Proxy Facade 在 Angular 应用 Lazy Load 中的作用
47 0
|
7月前
|
前端开发 JavaScript UED
Angular 应用 Lazy Loading 设计概述
Angular 应用 Lazy Loading 设计概述
41 0
|
7月前
|
UED
Angular 中的 code splitting 和 lazy loading 技术
Angular 中的 code splitting 和 lazy loading 技术
36 0
|
7月前
|
JavaScript 前端开发 开发者
实现 Angular Lazy loading 时应该避免 Static Imports 的原因
实现 Angular Lazy loading 时应该避免 Static Imports 的原因
23 0
|
7月前
|
UED
Angular 中 Lazy Loading 的陷阱与最佳实践
Angular 中 Lazy Loading 的陷阱与最佳实践
40 0
|
7月前
|
JavaScript 前端开发
如何对 Angular Lazy Loaded Module 进行 Customization
如何对 Angular Lazy Loaded Module 进行 Customization
25 0
|
15天前
|
存储 前端开发 API
浅谈 Angular 应用前端消息显示机制的一个实际需求
浅谈 Angular 应用前端消息显示机制的一个实际需求
16 0
|
15天前
|
设计模式 JavaScript 前端开发
什么是 Angular 应用里的 Custom provider
什么是 Angular 应用里的 Custom provider
36 2