值更改为 false 时未通知观察者

Observer not notified when value changed to false

我正在尝试 Angular 和 rxjs (6.0),但遇到了一个场景。

开始了,

这是我的示例代码库:https://stackblitz.com/edit/angular-kxqj8d?file=app%2Finput-overview-example.ts

var service = {
  isUserSignedIn: null
};
var myObservable$ = new BehaviorSubject(service);

setInterval(function() {
  debugger;
  service.isUserSignedIn = !service.isUserSignedIn;
  service = JSON.parse(JSON.stringify(service));
  console.log("--------------------------------------------")
  console.log("Value update to : " + service.isUserSignedIn)
  myObservable$.next(service);


}.bind(this), 5000);


myObservable$
  .pipe(
  filter((curr) => curr.isUserSignedIn != null),
  distinctUntilChanged((prev, curr) => {
    debugger;
    console.log("Value during comparison prev: " + prev.isUserSignedIn + " curr: " + curr.isUserSignedIn)
    return prev.isUserSignedIn === curr.isUserSignedIn;
  }))
  .subscribe(value => {
    console.log("Got Notified! New Value: " + value.isUserSignedIn);
  })

控制台日志如下:

在 "distinctUntilChanged" 运算符中,当标志 "service.isUserSignedIn" 设置为 false 时,prev 和 curr 的值相同。但是当相同的标志设置为 true 时工作正常!

因此,观察者未收到通知!

我花了两天时间试图弄清楚,但找不到问题所在。

你们能帮帮我吗?

您需要将 JSON.parse(JSON.stringify(service)) 的结果分配给一个新变量并将其传递给 next。如果您不这样做,那么您将覆盖以前的服务价值,从而有效地破坏了使用 JSON parse/stringify.

创建副本的目的

Updated Stackblitz

旁注

考虑这段更简洁的代码:

interval(5000).pipe(
  map(() => {
    service.isUserSignedIn = !service.isUserSignedIn;
    return JSON.parse(JSON.stringify(service));
  }),
  distinctUntilChanged((prev, curr) => {
    console.log(prev.isUserSignedIn, curr.isUserSignedIn)
    return prev.isUserSignedIn === curr.isUserSignedIn;
  })
)
.subscribe(value => {
  console.log(`Result: ${value.isUserSignedIn}`)
});