在@Component和@Module中插入提供程序的Angular2有什么区别？

在angular2中，可以在@Component元素中定义提供者，如

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css'],
  providers : [ DataService ]
})
export class HomeComponent implements OnInit {

...
}

而且在一个

@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ...
  ],
  providers: [ DataService ],
  bootstrap: [AppComponent ]
})
export class AppModule { }

---

在@NgModule或@Component中定义提供者有什么区别？如果我从两个选项中选择一个，那么定义提供者的最佳位置是什么？

@NgModule: 服务将是注入服务的模块（在构造函数内）的子组件中的一个单例

@Component:服务将是组件及其子组件内部的单例

资料来源：

何时使用NgModule以及何时使用应用程序组件？

一方面，在根注入器中注册NgModule中的提供者。这意味着在NgModule中注册的每个提供者都可以在整个应用程序中访问

另一方面，在应用程序组件中注册的提供程序仅在该组件及其所有子组件上可用

---

角度应用程序是组件树。每个部件都有自己的喷油器。因此，您有一个喷油器树。假设您具有以下设置：

    AppComponent
  /            \
 C1            C2
              /  \
            C3   C4

---

现在，如果您在任何

@NgModule

中定义了一个提供程序（延迟加载的提供程序除外），您将能够在任何组件（

C1、C2、C3、C4

）中访问该提供程序。如果在

@Component

中定义提供程序，例如在

C2

中，则只有

C2

及其子项

C2

才能访问该提供程序。但即使这样也可以配置。您可以使用诸如

@Self

之类的附加修饰符来搜索组件声明的依赖项。

不同之处在于范围

实际上

• “注入”是向构造函数添加参数
• 将其添加到

  提供者：[……]

  是“提供”

在一个组件上提供将导致多个实例

如果在组件中注册了提供程序，则可能会获得与组件实例数量相同的提供程序值实例（服务实例）。“潜在”是因为如果存在提供程序，但它从未实际注入，则不会创建任何实例

查找提供商

当DI创建一个组件、指令、管道或服务实例时，它会检查当前的注入器提供者和构造函数参数。 如果喷油器没有提供程序，则会检查父喷油器，直到找到提供程序或没有父喷油器为止

喷油器层次结构 在（非延迟加载）模块中注册的提供程序将添加到根注入器。延迟加载模块的注入器是子注入器。

AppComponent

s注入器也是根注入器的子注入器。 每个子组件或指令都会获得父组件注入器的子注入器

向组件或指令添加提供程序

这意味着，当您在组件上提供服务时，该组件及其子组件将从向该组件注册的提供程序获得一个实例。在其他任何地方都找不到提供程序，因此实例创建将失败

如果此组件有多个实例，则每个组件（及其子体）将获得此服务的不同实例

向模块添加提供程序

如果在

@NgModule（）

（非延迟加载）中注册了一个提供程序，那么每个组件和服务都将找到该提供程序，并且在任何地方都将注入相同的实例

向延迟加载的模块添加提供程序

如果在延迟加载模块的

@NgModule（）

中注册了提供程序，则该服务将仅适用于此模块加载的组件和服务