gpt4 book ai didi

angular5 - *ngIf 中的 AsyncPipe

转载 作者:行者123 更新时间:2023-12-02 20:23:45 27 4
gpt4 key购买 nike

我试图根据 *ngIf 中可观察到的 isComplex$ 值来显示 header 之一:

<complex-header *ngIf="isComplex$ | async; else ordinaryHeader"></complexheader>
<ng-template #ordinaryHeader>
<ordinary-header></ordinary-header>
</ng-template>

问题是 *ngIf 与 else 情况一起使用,而不等待 observable 发出值。如何完成两个 header 等待 observable 发出其第一个值。

最佳答案

使用 angular5 *ngIf else 指令。

<div class="course-detail" *ngIf="isComplex$ | async as isComplex else ordinary">
<complex-header *ngIf="isComplex"></complex-header>
<ordinary-header *ngIf="!isComplex"></ordinary-header>
</div>
<!-- Showing ordinary header for cases when observable is not returned this can be replaced wuth loader as well-->
<ng-template #ordinary>
<ordinary-header></ordinary-header>
</ng-template>

另请参阅https://blog.angular-university.io/angular-reactive-templates/

关于angular5 - *ngIf 中的 AsyncPipe,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50589564/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com