bootstrap 与 @component 中的 Angular2 提供程序

Question

据我了解，您可以在 bootstrap 调用中定义您的应用程序提供商，如下所示：

bootstrap(
  App,
  [disableDeprecatedForms(), provideForms()]]
)

或者像这样在你的根组件中：

@Component({
  selector: 'my-app',
  providers: [disableDeprecatedForms(), provideForms()],
  ...
)

但是，我创建了一个表单验证器插件，它需要 provideForms 提供程序，并且该指令仅在 bootstrap 选项时有效。我已经创建了一个 plunk to illstrate the problem：如果我将 providerForms() 添加到 bootstrap 调用，验证器就会工作。一旦我从 bootstrap 调用中注释掉 providerForms() ，验证器就不再工作了。我假设组件中的 providerForms 定义就足够了。有什么解释吗？

Answer 1

Angular2 DI 总是向上查找所请求依赖项的提供者。如果由 bootstrap 实例化的服务需要依赖项，则它不会注入在树的更下方提供的依赖项。

在根组件的 bootstrap(...) 和 @Component(...) 处提供并不等同，但这种区别与根组件或其子组件或其他后代中的所有内容无关。 bootstrap()比根组件高一级。

Angular2 样式指南还建议优先使用根组件而不是 bootstrap()，因为 bootstrap 应该保留用于系统内容。

在创建第一个组件之前需要实例化表单和路由器（例如，早期版本的 V3 路由器中存在一个错误，其中根组件需要注入 Router 或包含 routerLink，否则路由器不会启动）。

因此，由于在创建根组件之前需要实例化某些内容，因此出现了 bootstrap() 和根组件之间的差异变得相关的情况。

bootstrap 与 @component 中的 Angular2 提供程序

Angular2 providers in bootstrap vs @component

provider

dependency-injection

angular