行为主体不工作角度 5.

Question

我似乎无法弄清楚问题是什么，

我有一个服务，它有一个这样的行为主题......

popupSource = new BehaviorSubject<any>('');
popup(component) {
this.popupSource.next(component);
}

然后在我的标题组件中

popupClick() {
this._service.popup('example');    
}

然后在我的标题中.html

<button (click)="popupClick()"></button>

然后在我的应用组件中

ngOnInit() {
this._service.popupSource.subscribe((result) => {
console.log(result);
})
}

所以发生的事情是点击正在触发this._service.popup('example');但它从未击中订阅......

我已经在每个函数上放置了断点，它成功地到达了this.popupSource.next(component)但随后什么都没有？？每次单击按钮时，我都应该获取控制台日志。

我不确定我做错了什么...为了简洁起见，我省略了代码，所以如果您需要更多信息，请告诉我

编辑

我也尝试过做

private popupSource = new BehaviorSubject<any>('');
getPopup = this.popupSource.asObservable();
popup(component) {
this.popupSource.next(component);
}

和在我的应用程序中的组件列表结束到 getPopup 代替

ngOnInit() {
this._service.getPopup.subscribe((result) => {
console.log(result);
})
}

这也行不通，我无法弄清楚问题是什么......

谢谢

Answer 1

您在这里的问题是您在两个不同的模块中提供服务，最终有两个服务实例。如果您使用的是 Angular v6，最简单的方法是在服务中使用提供的 In标志：

import { Injectable } from '@angular/core';
@Injectable({providedIn: 'root'})
class myService {}

通过这种方式，您无需在任何模块的提供程序数组中提供服务，它将在根注入器中自动提供。

有关这方面的文档可以在这里找到：Angular 提供程序。

如果您使用的是 Angular v5，您应该只在 AppModule 中提供服务。

Answer 2

在服务中，编写一个新方法，如下所示：

popupSource = new BehaviorSubject<any>('');
getPopupSource() { 
return this.popupSource.asObservable();
}

并订阅它，而不是直接订阅主题本身。您可以在订阅时添加"asObservable(("部分，而不是创建一个全新的方法，但我喜欢单独的方法，这样我就可以保持主题的私密性，而且我通常会在整个应用程序的不同位置多次订阅某些内容，因此它减少了重复。

在您的组件中：

this._service.getPopupSource().subscribe( result => { etc...})

编辑：

演示重现您的方案 - https://stackblitz.com/edit/angular-n6esd5

Answer 3

你可能没有相同的服务实例，我的问题是我的服务有@Injectable({ providedIn: 'root'})，但我把这个服务放在组件提供程序 [] 数组中，只需删除提供程序数组，然后它就可以工作