angular - 可选的异步管道或默认

Question

如果可观察值未定义，我没有找到更好的方法来读取默认值。
而不是为模板中的每个可观察属性编写这部分代码

            <div *ngIf="!property.visible$
              ? property.visible || true
              : (property.visible$ | async">Test</div>

这里可以做最短的路吗？

目前正在寻找编写 customPipe 来完成相同工作的可能性，但似乎很难为了拥有此模板而扩展异步管道

property.visible$ | async: property.visible || true 

或者您有其他想法？

注意:

也可以在 ts 文件中使用此逻辑编写一个函数，但不认为每次更新 html 时获取 (1) 订阅值对性能来说不是一个好主意，我们需要读取一个可观察对象值(value)

Answer 1

您可以创建自己的可观察对象，然后使用 async 管道订阅它:

this.visible$ = of({}).pipe(switchMap(() => {
 if (this.property.visible$) return this.property.visible$;

 return of(this.property.visible);
}));

...

<div *ngIf="visible$ | async"></div>

请看这个stackblitz