Angular 5:如何在延迟加载的功能模块的组件中共享相同的服务实例?

时间:2018-04-20 10:34:07

标签: angular service components lazy-loading

我正在使用Angular 5,我创建了一个带路由的功能模块,并将其配置为延迟加载。 现在,我需要在功能模块内部的两个组件之间共享位于功能模块内的相同服务实例,以便在用户单击后将对象从一个组件传递到另一个组件在路由器链接上。

如果我把我要共享的服务放在app.module.ts的providers数组中,那么所有工作都按照我的预期进行。但是,如果我将该服务放在featureModule.module.ts的providers数组中,它就不起作用。

这里是项目的结构: Questionnaires feature module

所以最后,是否可以通过将服务放在功能模块的providers数组中来共享功能模块组件之间的相同服务实例,在本例中是在questionnaires.module.ts中?

1 个答案:

答案 0 :(得分:1)

你可以使用ModuleWithProviders创建一个服务单例,你可以定义返回ModuleWithProviders的static forRoot,你的sharedService将在所有延迟加载的模块中有一个实例

export class SharedModule {
  static forRoot(): ModuleWithProviders {
     return {
        ngModule: SharedModule,
        providers: [sharedService]
    }
  }
 }

你可以在app.module中使用.forRoot导入你的共享模块,所有延迟加载的模块都有一个实例

imports: [   
  SharedModule.forRoot()
],