混淆 Angular 2+ 模块、导出和服务 - 如何避免共享/可重用服务的多个实例

Question

给定我导入到主应用程序模块 ( BrowserModule import { HttpModule } from '@angular/http'; (，并且给定在应用程序中我到处执行Http服务的 DI，如果发生以下情况会发生什么：

我
• 使用其他模块，例如我创建了一个功能模块或下载了 npm 包，我们称之为CoolFeaturesModule
• CoolFeaturesModule本身正在导入HttpModule并注入Http服务

据我所知，每个模块都有自己的喷油器，每个喷油器都会注册一个Http服务提供商。因此，我将拥有Http服务的多个实例。这是对的吗？

Answer 1

将有多个基于 angular.io 文档的服务实例

依赖项是注入器范围内的单例。一 应用程序可能有多个注射器。Angular 应用程序是一个 组件树。每个组件实例都有自己的注入器。这 组件树与喷油器树平行。

Answer 2

如前所述，仅当不可否认项在依赖注入树中可用时，它们才是单例。当使用可注射物时，首先组件检查它的依赖数组，如果找到，它使用它。如果没有，它会爬到上面的树上，直到AppModule。在这个分生组中，如您所见，如果组件/模块是同级(或者不仅仅是以某种方式相互继承(，并且如果它们提供自己的 HttpService，它们将单独初始化它。

但是，如果您不使用延迟加载，则您的所有服务都将已经在主模块中被识别。因此，无论如何，您的服务将是全球性的，因此是单例的。

https://plnkr.co/edit/JpEDf1pxO95knVUQLwdE?p=preview

 import {Component, NgModule, VERSION,Injectable} from '@angular/core'
    import {BrowserModule} from '@angular/platform-browser'
    import {HttpModule,Http} from "@angular/http";
@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Hello {{name}}</h2>
    </div>
  `,
})
export class App {
  name:string;
  constructor() {
    this.name = `Angular! v${VERSION.full}`
  }
}

@Injectable() 
export class CustomHttpService{
  constructor(protected http: Http){
  }
}
@NgModule({
  imports:[HttpModule]
  providers:[CustomHttpService]
})
export class CustomHttpModule{}

@NgModule({
  imports: [ BrowserModule,CustomHttpModule],
  declarations: [ App ],
  bootstrap: [ App ]
})
export class AppModule {}