javascript - 如何创建 bool 类型的 Observable？

Question

我需要创建一个可发出 bool 值并且可以从函数中更改的 Observable。

我试过了

showModal$ = new Observable<boolean>();

但它不起作用。

我需要的是 showModal$ 默认为 false 。并用函数改变它的值

change() {
  this.showModal$ = !this.showModal$;
}

我正在使用 Angular2，我想从不同的组件订阅该 Observable。

最好的方法是什么？

Answer 1

使用 BehaviorSubject

showModal$ = new BehaviorSubject<boolean>(false);

change() {
  this.showModal$.next(!this.showModal$.getValue());
}

这是一个 JavaScript 演示

const { BehaviorSubject, fromEvent } = rxjs;

const showModal$ = new BehaviorSubject(false);

function change() {
  showModal$.next(!showModal$.getValue());
}

fromEvent(document.getElementById('change'), 'click').subscribe(_ => {
  change();
});

showModal$.subscribe(showModal => {
  console.log(`Modal is shown is ${showModal}`);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.4.0/rxjs.umd.min.js"></script>
<button id="change">Change</button>