javascript - 如何在 ngModules 之间共享服务和状态

Question

1. 我们如何使用 ngrx 在 ngModules 之间共享状态？
2. 我们如何在 ngModules 之间共享同一个服务实例？

Angular2-RC5。

Answer 1

模块需要有相同的服务实例。要实现这一点，该服务需要仅位于您的 Bootstrap AppModule 的 providers 中。否则，如果在不同的提供商中发现相同的服务，您可能正在运行并行实例。

那么问题就变成了:如何在顶级 providers 中获取服务，但将其从所有其他模块中排除？

使用您自己编写的服务，这非常简单。

• 如果该服务是 AppModule 的一部分，则将它放在该模块的 providers 中，而不是其他地方
• 如果该服务位于您要导入其他模块的另一个模块(我们称它为 DummyModule)中，请确保不将其放入DummyModule 的 providers 或 Angular 注入(inject)器将为每个导入 DummyModule 的惰性加载模块创建一个并行实例。相反，您希望通过 forRoot() 静态方法公开该服务。

所以改变:

@NgModule({
  providers: [ MyService]
})
export class DummyModule{ }

收件人:

@NgModule({
  providers: [] //empty since we want a singleton service
})
export class DummyModule{
  static forRoot() {
    return {ngModule: DummyModule, providers: [ MyService ]};
  }
}

现在，当常规模块imports: [DummyModule] 时，它们将不会获得MyService。另一方面，在 AppModule 中，您有 imports: [DummyModule.forRoot()] 来公开服务。因此，只有最顶层的组件才能获得服务，并且您将拥有一个在所有模块之间共享的实例。

使用第 3 方服务，这并不简单。

基本上，如果第 3 方开发人员也使用 @NgModule，则您需要第 3 方开发人员进行上述更改。或者，您可以创建一个自定义模块，而不是导入第 3 方模块，该模块声明该模块的组件、管道和指令，但实现上述更改以将该模块的服务放入 forRoot() 方法中。

这就是我为获得第 3 方服务所做的工作——MdIconService(Angular Material 模块的一部分)——作为单个实例工作，即使它的模块尚未正确配置. See this github issue.