Question

我在理解Angular2在依赖注入方面使用的逻辑时遇到了一些麻烦。这是我的情况：

app.component.ts：

import {Component} from 'angular2/core';
import {Demo1Service} from './demo-1.service';

@Component({
    selector: 'app',
    template: `<div>test template</div>`,
    providers: [Demo1Service]
})
class AppComponent {
    constructor(private _demo1Service: Demo1Service) {}
}

export {AppComponent};

演示1.service.ts

import {Injectable} from 'angular2/core';
import {Data1Store} from './data-1.store';

@Injectable()
class Demo1Service {
    constructor(private _data1Store: Data1Store) {}
};

export {Demo1Service};

数据-1.store.ts

import {Injectable} from 'angular2/core';

@Injectable()
class Data1Store {}

export {Data1Store};

http://plnkr.co/edit/4aBNbAxtHbUvVqxPRUbv?p=preview

如果您运行此plunker，您将看到Angular需要在AppComponent中定义Data1Store的提供程序。为了解决一些问题，我希望AppComponent不需要了解Data1Store的存在。

我有什么东西在这里吗？

Answer 1

实际上，提供程序需要在执行Demo1Service服务时显示。由于分层注入器，在组件级别定义相应的提供程序并不是强制性的。

这也适用于整个应用程序或父注入器。在引导您的应用程序时定义此提供程序似乎是您所需要的：

bootstrap(AppComponent, [ Demo1Service, Data1Store ]);

这样您就不需要在组件的providers属性中定义服务提供商

以下是所有这些元素及其关系的概述：

Application
     |
AppComponent  --- Demo1Service --- Data1Store

在这种应用中，我们有两个注射器：

可以使用bootstrap函数
可以使用此组件的AppComponent属性配置的providers注入器。它可以＆＃34;看＆＃34;应用程序注入器中定义的元素。这意味着如果在此提供程序中找不到提供程序，它将自动查找此父注入程序。如果在后者中找不到，则找不到＆＃34;提供商＆＃34;错误将被抛出。这个问题可以为您提供有关Angular分层注入器如何工作的更多细节：
What's the best way to inject one service into another in angular 2 (Beta)?

Angular2：需要在组件中添加提供程序以依赖服务吗？

1 个答案: