[英]ng-container with *ngIf else template don't work with ContentChildren QueryList
我試圖通過@ContentChildren
和QueryList
動態更改組件的內容QueryList
ng-container *ngIf="condition; else tplRef"
,當condition
為true時ng-container
內容由QueryList
可見,但是當condition
為false時, ng-template
內容不可見。
我的目標是根據條件顯示不同的元素,這些條件可以通過“查詢”看到
您需要將<ng-template #ref>... </ng-template>
保留在<app-container>
嘗試這樣:
<app-container>
<app-container-item name="Item 1"></app-container-item>
<app-container-item name="Item 2"></app-container-item>
<!-- work fine if true -->
<ng-container *ngIf="true; else ref">
<app-container-item name="Item when true"></app-container-item>
</ng-container>
<!-- should display content from ref, but don't work :( -->
<ng-container *ngIf="false; else ref">
<app-container-item name="Item when true"></app-container-item>
</ng-container>
<ng-template #ref>
<app-container-item name="Item when false"></app-container-item>
</ng-template>
</app-container>
您已經分居了<ng-template #ref>
從<app-container>
,你必須保持<ng-template #ref>
里面的<app-contianer>
那就是解決方案!
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.