RxJs 主题在订阅时获得多个值答案

【问题标题】：RxJs Subject getting multiple values on subscribeRxJs 主题在订阅时获得多个值
【发布时间】：2020-09-25 09:38:04
【问题描述】：

我的 Angular 服务中有一个主题，如下所示：

private sub = new Subject();


sendSub(page: page) {
    this.sub.next(page);
}

getSub(): Observable<any> {
    return this.sub.asObservable();
}

在我的父组件中，我订阅了getSub()。从我的子组件中，我发送了一个下一个值，但在父组件中，我收到了两个订阅值。

只需要一个值，以便我的代码块只执行一次：

subscription: Subscription;

this.subscription = this.pageService
    .getSub()
    .subscribe(
        (data) => {
            this.data = data;
            this.nextSelection();
        }
    );

【问题讨论】：

你在哪里打电话给this.pageService.getSub().subscribe()？提供一些上下文。
@fridoo 调用在父构造函数块中
您的父组件可能会被创建两次。在构造函数中放入console.log，检查是否执行了两次。
getSub() 在应用程序中只调用一次，这是唯一使用来自主题的数据的实例。 @fridoo
好吧，如果 subscribe next 回调执行两次，可能有两个原因。您订阅一次并且主题发出两次，或者您订阅两次并且主题发出一次。你有退订吗？

标签： angular rxjs subject-observer

【解决方案1】：

改变

getSub(): Observable<any> {
  return this.sub.asObservable();
}

到

getSub: Observable<any> = this.sub.asObservable();

这样可以确保每个订阅者都使用相同的主题。

【讨论】：

谢谢。我尝试了这种方法，结果是一样的。只是上述 cmets 中的一个信息我只有一个消费者，但值设置是从多个位置完成的，但在任何时候都只有一个

【解决方案2】：

在父组件的构造函数中添加订阅代码Here is a fiddle of the same

this.appService
    .getSub()
    .subscribe(
        (data) => {
             this.data = data;
             this.nextSelection();
        }
    );

【讨论】：

感谢您的回复。我的代码中并没有太大的差异，建议因为我的代码中的订阅使我可以轻松地取消订阅呼叫。