依赖注入如何在 Angular 2 组件之外工作？

在 Angular 2 (Beta) 中注入服务

在 Angular 2 中，将服务注入到组件中很简单，但是我们如何利用依赖注入（DI）将服务传输到组件之外？

在组件之外注入服务

为了实现这一点，我们使用 @Injectable 装饰器注释所需的服务。这个装饰器表示被注解的类的构造函数中的参数应该接收注入。

理解注入机制

Angular 2 中的 DI 机制在树上运行喷射器以分层结构链接。这些注入器映射到组件树上，但没有特定的服务注入器。

当服务使用 @Injectable 注解时，Angular 会尝试在当前的注入器中创建或检索该服务类型的实例。执行链。

示例：服务注入链

考虑以下示例应用程序：

• AppComponent（主要组件）
• ChildComponent（子组件）
• Service1（由 ChildComponent 使用）
• Service2（由 Service1 使用）

每个服务和组件都用 @Injectable 注解。

注入器层次结构和服务注入

在此应用程序中，我们有三个注入器：

• 应用程序注入器（在引导期间配置）
• AppComponent 注入器（通过其providers 属性配置）
• ChildComponent 注入器（类似配置）

将 Service1 注入 ChildComponent 时，Angular 首先在 ChildComponent 注入器中搜索 Service1 提供者，然后在 AppComponent 注入器中，最后在应用程序注入器中。

同样，当将 Service2 注入 Service1 时，会发生相同的搜索过程。

Provider 范围和 Injector 层次结构

此搜索过程确定在何处实例化和共享服务实例。可以在不同级别指定提供程序：

• 应用程序级别：实例在整个应用程序中共享。
• 组件级别：实例在组件、其子组件和依赖服务内共享。

结论

通过利用 @Injectable 装饰器并了解 Angular 2 中的 DI 机制，我们可以有效地在组件和服务之间注入服务，从而使我们能够根据需要组织和共享依赖项。

以上是依赖注入如何在 Angular 2 组件之外工作？的详细内容。更多信息请关注PHP中文网其他相关文章！