javascript - BehaviorSubject 不工作 Angular 5

Question

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

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

popupSource = new BehaviorSubject<any>('');

popup(component) {
   this.popupSource.next(component);
}

然后在我的头部组件中

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

然后在我的 header.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，最简单的方法是在您的服务中使用 providedIn 标志:

import { Injectable } from '@angular/core';

@Injectable({providedIn: 'root'})
class myService {}

通过这种方式，您无需在任何模块的 providers 数组中提供您的服务，它会自动在根注入(inject)器中提供。

关于此的文档可以在这里找到:Angular providers .

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