angular - 如何使用 Angular 中的异步管道处理 bool 可观察对象

Question

我有以下代码:

public obs$: Observable<boolean>

<div *ngIf="(obs$ | async) === true || (obs$ | async) === false">
  {{ (obs$ | async) ? 'yes' : 'no' }}
</div>

它按预期工作，但是 if看起来有点冗长。

问题是我不能简单地做 <div *ngIf="(obs$ | async)"> .如果我尝试这样做，它将在 observable 尚未发出值或值为 true 的情况下起作用，但如果值为 false 则它将不起作用，因为 if 将评估为 false 而 div 不是显示。

我假设如果返回一个虚假值，例如空字符串或 0，同样的问题也适用。

有更好、更简单的方法吗？

Answer 1

这是一种您可以共享订阅而不必创建任何自定义管道的方法:

<ng-container *ngIf="{value: obs$ | async} as context">
    {{context.value}}
</ng-container>

*ngIf 无论如何(我相信)都会评估为 true 然后您可以对 value 进行自己的测试context 对象。

...如果他们只实现 *ngLet 我认为会更好!

我喜欢这个解决方案的一点是，结果值可以重用，只需使用 async 管道一次，而且它仍然非常简洁(即使它并不完美)。