2017-02-18 71 views
2

嗨,所有人,并感谢您的帮助提前... 我正在建立一个应用程序,我想有一个服务,是用来处理一些配置和它由不同的模块共享。 我真的不知道这是否是最好的方法,但我使用这个,因为angularJS。角2和rxjs服务主体没有正在更新组件

配置服务

sidebarCompress: Subject<boolean> = new Subject<boolean>(); 
public sidebarCompressed: Observable<boolean> = this.sidebarCompress.asObservable(); 

constructor() {} 

compressSidebar(val: boolean = false) { 
    this.sidebarCompress.next(val); 
    // this is firing when used 
    console.log('changed on service'); 
} 

边栏组件

constructor(
    private conf: ConfigService, 
) { 
    conf.sidebarCompressed.subscribe(
     sidebarCompressed => { 
      // this is not firing 
      console.log('changed on sidebar component'); 
    }); 
} 

任何其它组分

constructor(
    private conf: ConfigService, 
) { } 

ngOnInit() { 
    // The idea is to use it in a fn (not always on init) 
    this.conf.compressSidebar(true); 
} 

所以,边栏组件订阅不起作用,任何人都知道我在这里做错了什么,或者如果我应该采取不同的做法!?

再次,非常感谢。

+0

你在哪里提供'ConfigService'? –

+0

'ConfigService'在每个模块中提供。 在这种情况下,我有模块,我有'SidebarComponent'和一个懒惰的加载模块调用与试图压缩侧边栏的组件。 这两个模块都提供了'ConfigService' ... 我也提供'app.module'以及... –

回答

4

如果您在@NgModule()中提供服务,您将为整个应用程序获得一个实例,除非您还在延迟加载的模块的@Component()@NgModule()中提供该服务。在@NgModule()提供

提供商被提升到应用程序根注射器,其中的模块事务导入顺序和模块在imports: []覆盖前面的模块提供者如果提供密钥匹配后列出。在AppModule s @NgModule()中增加的提供者直接覆盖导入模块的提供者。

延迟加载模块获取自己的“根作用域”,它是应用程序根注入器的子注入器。

我假设你的问题是由在一个非延迟加载的延迟加载模块中提供服务引起的,这会导致2个实例。

注入此模块的组件或服务从应用程序根目录获取实例,如果它们是非延迟加载的模块的一部分,或者在它们是延迟加载模块的一部分时从延迟加载模块获取。

作为解决方案,从延迟加载的模块中删除提供程序。 您也可以在AppModule中执行forRoot()和导入MyLazyLoadedModule.forRoot()以将延迟加载模块的服务获取到应用程序根注入器中,并避免重复的服务实例。

+1

非常感谢! 你是完全正确的。 :) –