2017-08-01 68 views
0

我想分享的服务组件,对于这一点,我已经创建service.ts其中代码如下:角2 - 共享服务在负载

import { Subject } from 'rxjs/Subject'; 

export class CommonService { 
    CommonList = new Subject<any>(); 
} 

当然,这项服务是供应商列表中的app.module.ts 然后,我有一个组件边栏。 从侧边栏组件我想要订阅此服务:

ngOnInit() { 
    this.subscription = this.CommonServicePrivate.CommonList.subscribe(
     (result: any) => { 
     console.log(result); 
     } 
    ); 
    } 

这是问题所在,如果我尝试在此服务的app.component.ts通过一些方法添加一些列表:

click(){ 
    this.CommonService.CommonList.next([{"some_key":"some_value"}]); 
    } 

这实际上有效,但是当我尝试这个时:

ngOnInit(){ 
    this.CommonService.CommonList.next([{"some_key":"some_value"}]); 
    } 

它不起作用。

问题是我想将此服务传递给加载应用程序上的组件。

在ngAfterViewInit的情况下,当我试图这样的结果使一些模板,我得到错误: ExpressionChangedAfterItHasBeenCheckedError:它检查后表达发生了变化。先前的值:'未定义'。当前值:

如果有人有这样的经历,请你分享给我。 谢谢。

+0

我猜你正在寻找您需要的组件右侧数据的组件加载之前路由器的决心? –

+0

叶氏,因为有关补充工具栏的信息从REST API来了,我需要自动加载它,但还有一点就是这个侧边栏,我应该在另一个组件加载以及,所以我真的不希望两次调用这个API,解决方案是,我将其存储在服务,从元器件我会调用这个服务,但问题是,正如我所说:通过它的工作方法,但onload事件 - 它不工作,有时给我错误: 例外:表达发生了变化检查完毕后。 –

回答

0

我可以建议为ExpressionChangedAfterItHasBeenCheckedError工作。

这是由冈特这里https://stackoverflow.com/a/43375600/2708210

指出,你可以做的就是让一个setTimeout的,我有这个问题,这是一个变通的内部调用一个真正的错误。

this.subscription = this.service.spinner$ 
    .subscribe(item => setTimeout(() => this.showProgress = item, 0)); 

This is a peice of code from my app git link

+0

似乎工作,但我有点疑惑的setTimeout,我的意思是,如果此服务需要一定的时间,例如2其次从一些API来获取,然后加载到它会发生什么?你测试过这种情况吗? –

+0

是的,我使用它的firebase情况下,它工作正常,所以农场我的情况是每次我的组件loafsbthe值变化来回,所以这是唯一的方法+不妨碍aot构建 –

+0

Yeap,我做了测试以及权利现在,只是做了睡眠功能的PHP文件,并从角度调用它,它的工作原理,男人谢谢你:) –

0

当订阅它时,主体将为其订阅发出价值。当你从ngOnInit推动CommonList的价值时,它确实发出价值。但是底层的内部组件(事件订阅)还没有发生。

你可以通过使用ngAfterViewInit生命周期钩子来解决这个问题,它确保内部组件树已经初始化(期望内容投影)。本质上它将确保组件subscription已经发生。

ngAfterViewInit(){ 
    this.CommonService.CommonList.next([{"some_key":"some_value"}]); 
} 

或达到相同的目标是,用BehaviourSubject inspite的Subject的另一种方式。这两者之间有区别BehaviourSubject商店&发出其最后一次订阅。

+0

不,在这种情况下,还有另外一个问题,这应该在模板中呈现,这样所有的时间我得到错误: ExpressionChangedAfterItHasBeenCheckedError:它检查后表达发生了变化。先前的值:'未定义'。当前值: –

+0

@ mr_e30你给拉升呢? –