I want to conditionally show a block only if it contains data, otherwise I will show a noContent block. the data is fetched from the server.
<ng-container *ngIf="data$ async as data && data.payload; else noContent">
{{data.payload | json}}
</ng-container>
<ng-template #noContent> No content found </ng-template>
notes: 1- I dont want to implement two s, ie:
<ng-container *ngIf="data$ async as data ; else noContent">
<ng-container *ngIf="data.payload; else noContent">
{{data.payload | json }}
</ng-container>
</ng-container>
...
2- the following statements are working
*ngIf="xx && yy"
*ngIf="data$ as data"
*ngIf="xx && data$ as data"
*ngIf="(data$ as data)?.payload?.length>0; else noContent"
Try like this
<ng-container *ngIf="(data$ | async ) as d; else noContent">
<ng-container *ngIf="d.payload?.length > 5 ;else noContent">
<h3>
{{d.payload | json}}
</h3>
</ng-container>
</ng-container>
<ng-template #noContent> No content found </ng-template>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.