什么是注入上下文？
在angular中，依赖注入（di）是一个核心概念，用于提供组件、服务或其他类所需的依赖项。注入上下文可以被理解为在应用程序的特定执行点上，可用于inject()函数解析依赖项的提供者（provider）集合。当一个组件被实例化时，angular会为其建立一个注入上下文。这个上下文首先在其自身的注入器中查找提供者，然后递归地向上遍历其父级注入器，直到根注入器，以此来确定可用的服务。
简单来说，注入上下文就是inject()函数能够找到并提供依赖的“环境”。
注入上下文的重要性
注入上下文的重要性体现在以下几个方面：
- 依赖解析的范围控制：它精确地定义了在特定位置哪些服务是可用的。如果一个服务不在当前的注入上下文中，那么尝试注入它将导致运行时错误。
- 避免运行时错误：通过在组件树的适当级别定义提供者，可以确保在需要时它们是可用的，从而避免“No provider for X!”之类的错误。
- 优化应用性能与内存：合理管理提供者作用域（例如，使用providedIn: 'root'、'platform'或特定模块/组件）可以控制服务的生命周期和实例化次数，有助于优化资源使用。
- 支持更灵活的注入模式：随着Angular的发展，inject()函数不再局限于构造函数，而注入上下文的概念变得更加关键，以支持在任何地方（如函数、字段初始化器）进行注入。
inject() 函数与默认注入上下文
inject()函数是Angular中用于在不依赖构造函数参数的情况下获取依赖项的核心API。它需要在一个有效的注入上下文中被调用。Angular会自动为以下场景提供默认的注入上下文：
-
构造函数（Constructor）：这是最常见的注入点。当Angular实例化一个类时，它会自动在构造函数执行期间建立注入上下文。
import { Component, inject } from '@angular/core'; import { MyService } from './my.service'; @Component({ selector: 'app-my-component', template: `...` }) export class MyComponent { // 在构造函数中，inject() 自动工作 private myService: MyService; constructor() { this.myService = inject(MyService); } } -
工厂函数（Factory Function）：当定义一个提供者，其useFactory属性是一个函数时，该工厂函数在执行时也会处于一个注入上下文中。
import { InjectionToken, inject } from '@angular/core'; export const CONFIG_TOKEN = new InjectionToken('Config Token', { providedIn: 'root', factory: () => { // 在工厂函数中，inject() 自动工作 const env = inject(EnvironmentService); // 假设有一个 EnvironmentService return env.getApiUrl(); } }); -
字段初始化器（Field Initializer）：在Angular 14+中，inject()可以直接在类字段的初始化器中使用，这极大地简化了代码。
import { Component, inject } from '@angular/core'; import { MyService } from './my.service'; @Component({ selector: 'app-my-component', template: `...` }) export class MyComponent { // 在字段初始化器中，inject() 自动工作 private myService = inject(MyService); // 其他逻辑... }在上述所有情况下，Angular运行时会确保在inject()被调用时存在一个有效的注入上下文。
手动管理注入上下文：runInInjectionContext 与 EnvironmentInjector#runInContext
有时，我们需要在Angular无法自动提供注入上下文的地方（例如，普通的JavaScript函数、事件回调、定时器回调等）使用inject()。为了应对这种情况，Angular提供了手动建立注入上下文的机制。
-
runInInjectionContext(injector: Injector, fn: Function): any 这是Angular 14+引入的一个实用函数，它允许你提供一个Injector实例，并在该注入器的上下文中执行一个函数。在函数执行期间，inject()就可以正常工作。
import { Component, inject, Injector } from '@angular/core'; import { MyService } from './my.service'; import { AnotherService } from './another.service'; @Component({ selector: 'app-manual-context', template: ` `, standalone: true // 假设是独立组件 }) export class ManualContextComponent { private injector = inject(Injector); // 获取当前组件的注入器 loadData(): void { // 假设 MyService 和 AnotherService 需要在非 Angular 生命周期中被注入 // 比如在某个第三方库的回调中 setTimeout(() => { runInInjectionContext(this.injector, () => { // 在这个回调函数内部，inject() 可以正常工作 const myService = inject(MyService); const anotherService = inject(AnotherService); console.log('Services injected in manual context:', myService, anotherService); myService.doSomething(); }); }, 1000); } }使用场景：
- 在非Angular管理的代码中（如Web Workers、Service Workers、第三方库回调）。
- 在普通的JavaScript函数中，需要访问Angular服务。
- 在测试环境中，模拟特定的注入上下文。
-
EnvironmentInjector#runInContext(fn: Function): anyEnvironmentInjector是Angular应用中最高级别的注入器之一，通常用于提供应用范围的服务。它的runInContext方法与runInInjectionContext类似，但它是EnvironmentInjector实例上的一个方法。
import { Injectable, EnvironmentInjector, inject } from '@angular/core'; import { AppConfig } from './app-config.service'; @Injectable({ providedIn: 'root' }) export class StartupService { constructor(private environmentInjector: EnvironmentInjector) {} initializeApplication(): void { this.environmentInjector.runInContext(() => { // 在 EnvironmentInjector 的上下文中注入 AppConfig const config = inject(AppConfig); console.log('AppConfig loaded:', config.apiUrl); // 可以在这里执行一些依赖于根级服务的初始化逻辑 }); } }使用场景：
- 在应用程序启动时，需要访问根级（providedIn: 'root'）服务进行初始化，而这些初始化逻辑又不在组件或服务的构造函数中。
- 需要在一个全局的、与组件树无关的上下文中执行注入操作。
总结与最佳实践
- 理解默认上下文：优先在Angular自动提供注入上下文的地方（构造函数、字段初始化器、工厂函数）使用inject()，这是最简洁和推荐的方式。
- 按需手动管理：当需要在非默认注入点使用inject()时，利用runInInjectionContext或EnvironmentInjector#runInContext来明确建立注入上下文。
- 选择合适的注入器：使用runInInjectionContext时，传入的Injector实例至关重要。它决定了inject()将从哪个层级的注入器开始查找依赖。通常，你可以注入Injector本身来获取当前组件或服务的注入器。
- 避免滥用：频繁地手动创建注入上下文可能会使代码变得复杂，并可能隐藏依赖关系。应仅在确实需要时使用这些高级功能。
- 提供者作用域：始终考虑你的服务应该在哪个作用域可用（例如，providedIn: 'root'用于单例，特定模块或组件的providers数组用于局部作用域），这直接影响到注入上下文的构建。
通过深入理解注入上下文，开发者可以更精确地控制依赖的解析过程，编写出更健壮、可维护的Angular应用。
