Angular 的DI - 注入树

在Angular 2中，每个应用程序不只有一个注入器，每个应用程序至少有一个注入器。 注入器被组织在与Angular 2的组件树平行的树中。

考虑下面的树，它是一个包含两个打开的聊天窗口和登录/注销小部件的聊天应用程序的模型。

Figure: Image of a Component Tree, and a DI Tree

在上图中，有一个根注入器，它通过的providers数组建立。有一个LoginService注册到根注入器。

根注入器下面是根。这个特定的组件没有 providers 数组，并将使用根注入器的所有依赖项。

还有两个子注入器，每个组件一个。每个组件都有自己的ChatService实例。

第三个子组件是Logout/Login，但它没有注入器。

注入器树不会为每个组件创建新的注入器，但会为每个在其装饰器中具有providers数组的组件创建一个新的注入器。

没有providers 数组的组件查看其注册器的父组件。如果父级没有注入器，它将查找，直到它到达根注入器。

警告：请小心使用 数组。如果子组件使用父组件的providers数组中依赖进行装饰，则子组件将影响父组件的依赖关系。这可能带来各种意想不到的后果。

考虑下面的例子：

app/module.ts

在上面的示例中，Unique被引导到根注入器。

app/services/unique.ts

app/components/child-inheritor.component.ts

子继承器没有注入器。它将向上遍历组件树，寻找注入器。

app/components/child-own-injector.component.ts

The child own injector component has an injector that is populated with its own instance of Unique. This component will not share the same value as the root injector’s Unique instance.

子组件自己的注入组件有一个注入器，它填充了自己的实例。 此组件不会与根注入器的Unique实例共享相同的值。

app/containers/app.ts