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

Question

我正在尝试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时，可以正常工作！

因此，没有通知观察者！

我花了最后两天的时间来弄清楚，但找不到问题所在。

你们能帮我吗？

Answer 1

您需要将JSON.parse(JSON.stringify(service))的结果分配给新变量，并将其传递给next。如果不这样做，那么您将覆盖先前的service值，从而实际上无法实现使用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}`)
});