删除 angular 服务中存储的可观察值

Question

我有一个可观察的服务：

GetInputValueObservableService:

private inputObservable = new BehaviourSubject<string>(null);
setObservable(text) {
   this.inputObservable.next(text);
}
getObservable() {
   return this.inputObservable;
}

我有一个组件 sets/gets 点击时的输入值：

so if I have 'initial text' text showing up in html because inputObservable has null value initially and I click on a button that triggers observable and sets 'new text'

现在我导航到其他页面并返回它仍然显示 'new text' 可能是因为 inputObservable 保存了新文本，我是否也需要将值重置为 null？

我在组件的 onDestory 期间取消订阅了 observable。

可能是我做错了？有什么想法吗？

提示：订阅：

this.sub = this.getInputValueObservableService.subscribe((newText)=>{
   this.text = newText
})

onDestroy:

this.sub.unsubscribe();

Answer 1

取消订阅不会刷新 observable 中的值。它仍然存在，当您导航回组件并再次订阅时，您将获得最新的价值。如果你想这样做，就在取消订阅之前将一个 null 推送到 observable。

ngOnDestroy(): void {
  yourService.setObservable(null);
  this.sub.unsubscribe();
}

// or create a function for that in your service
clearObservable(): void {
  this.inputObservable.next(null);
}

Answer 2

问题的根源在于使用 BehaviorSubject。它可以 hold/buffer 当前值并立即将其发送给未来的订阅者。相反，您可以尝试使用 RxJS Subject。它只开始向订阅后推送给它的观察者发出通知。

您会发现差异 b/n 不同的多播可观察对象。

尝试以下方法

GetInputValueObservableService

import { Subject, Observable } from 'rxjs';

private inputObservable: Subject<string> = new Subject<string>();  // <-- no default value needed

setObservable(text) {
   this.inputObservable.next(text);
}

getObservable(): Observable<string> {
   return this.inputObservable.asObservable();
}

然而，ngOnDestroy() 中的取消订阅不能删除，因为没有它可能会出现重复订阅。

删除 angular 服务中存储的可观察值

Deleting stored observable value in angular service

angular

rxjs

observable

angular10