为什么在 ngOnInit 上调用 ReplaySubject？答案

【问题标题】：Why ReplaySubject is getting called on ngOnInit?为什么在 ngOnInit 上调用 ReplaySubject？
【发布时间】：2020-12-06 09:47:13
【问题描述】：

我正在尝试在 2 个组件之间进行交互，即标题组件和包含反应形式的路由器出口组件。几天前，经过大量研究，我得到了一个答案，告诉我使用共享服务，并且有一个 ReplaySubject 变量。这将充当Observable，它将在router-outlet 中的组件的ngOnInit 中调用。所以问题就出现在这里了。一切正常，但刚才在测试时发现了一个小错误。单击标题中的按钮后，该事件在主组件中触发，但它一直保持活动状态，直到我重新加载页面。以下是我的代码：

shared.service.ts

public updateSrc = new ReplaySubject<any>(1);
public updateClick = this.updateSrc.asObservable();

header.component.ts（这里点击了一个按钮）

update() {
  return this.dataService.updateSrc.next(true);
}

main.component.ts（这里的主要操作是点击标题按钮）

updateClicked = new Subject<any>();

ngOnInit() {
  this.dataService.updateClick.pipe(takeUntil(this.updateClicked)).subscribe({
    next: value => console.log(value); // At first click of button this happening perfectly but if coming from different route & had clicked the header button previously this thing is getting triggered
  });
}

ngOnDestroy() {
  this.updateClicked.next(); // Closing subscription here
}

谁能建议我如何重置这个？

【问题讨论】：

ReplaySubject 存储“当前”值。这意味着它将“旧”值发送给新订阅者。
有什么方法可以销毁它？我正在关闭订阅仍然是一样的
非常确定您必须在updateClicked 主题上调用complete() 以及next() 才能触发takeUntil

标签： javascript angular typescript observable angular9

【解决方案1】：

ReplaySubject（和BehaviorSubject）存储以前发出的值，并在添加新订阅者时发出这些值。

如果您不希望新订阅者接收之前发出的值，您始终可以使用不存储发出值的Subject。

您可能想了解更多关于the docs 中可用变体的信息。

【讨论】：

是的，我在那之后尝试了这个，感谢您的不同