在 Angular 中，注入器是一个非常重要的概念。它允许我们在组件或服务中注入依赖项，以便在运行时使用它们。在本文中，我们将深入探讨 Angular 中的注入器，包括它们的工作原理、如何使用它们以及它们的一些高级用法。
工作原理
在 Angular 中，注入器是一个依赖注入（DI）系统的核心组件。依赖注入是指在运行时将依赖项注入到组件或服务中。这使得我们可以将代码分离成更小的、可重用的部分，并使测试变得更加容易。
在 Angular 中，注入器是一个层次结构，每个组件或服务都有自己的注入器。当我们请求一个依赖项时，注入器会首先查找该组件或服务的注入器，如果找不到，它会向上遍历注入器树，直到找到该依赖项或到达根注入器。
如何使用注入器
在 Angular 中，我们可以使用 @Injectable 装饰器将服务标记为可注入的。然后，我们可以在组件或其他服务中使用 constructor 函数注入服务。例如：
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Injectable()
export class MyService {
constructor(private http: HttpClient) {}
}在这个例子中，我们使用 @Injectable 装饰器将 MyService 标记为可注入的，并在构造函数中注入了 HttpClient 服务。
高级用法
在 Angular 中，注入器还有一些高级用法，如：
提供器
我们可以使用提供器来告诉注入器如何创建依赖项。提供器可以是一个服务、一个工厂函数或一个值。例如：
-- -------------------- ---- ------- ------ - ----------- -------- - ---- ---------------- ------------- ----- --------- -- ----- ------------------ -------- - - -------- ---------- --------- --------- --
在这个例子中，我们定义了一个 MyService 类型的提供器，告诉注入器如何创建 MyService 的实例。
延迟注入
我们可以使用 @Inject 装饰器和 InjectionToken 类来实现延迟注入。这对于需要在运行时根据条件加载依赖项的情况非常有用。例如：
import { InjectionToken, Inject } from '@angular/core';
const MY_CONDITION = new InjectionToken<boolean>('MyCondition');
@Injectable()
class MyService {
constructor(@Inject(MY_CONDITION) private myCondition: boolean) {}
}在这个例子中，我们使用 InjectionToken 类定义了一个名为 MY_CONDITION 的依赖项，该依赖项是一个布尔值。然后，在 MyService 的构造函数中，我们使用 @Inject 装饰器注入了该依赖项。
自定义注入器
我们可以使用 Injector.create() 方法创建自定义注入器。这对于在测试中模拟依赖项非常有用。例如：
-- -------------------- ---- ------- ------ - -------- - ---- ---------------- ----- ----------- -- ----- -------- - ----------------- ---------- -- -------- ---------- --------- ----------- -- --- ----- ------- - ------------------------
在这个例子中，我们使用 Injector.create() 方法创建了一个带有自定义提供器的注入器。然后，我们可以使用 injector.get() 方法获取 MyService 的实例，该实例将使用 MockService 替代原始的 MyService 实现。
结论
注入器是 Angular 中依赖注入系统的核心组件。它允许我们在组件或服务中注入依赖项，并使代码更具可重用性和可测试性。在本文中，我们深入探讨了注入器的工作原理、如何使用它们以及它们的一些高级用法。希望这篇文章能够帮助你更好地理解 Angular 中的注入器。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674415c6f3dd653032a26b3f