我有一個<ng-container *ngFor='let column of columns'></ng-container>,顯示由于在頁面上多次*ngFor。我想將“粘性”屬性(指令)僅應用于這些 ng-container 元素中的第一個。不給其他人。我怎樣才能做到這一點?輸出應如下所示:
<ng-container sticky></ng-container>
<ng-container></ng-container>
<ng-container></ng-container>
<ng-container></ng-container>
...
uj5u.com熱心網友回復:
該ngFor指令有一個first僅在第一次迭代時為真的變數。
ngIf有一個else關鍵字,結合模板變數可以有條件地呈現兩個模板之一。
<ng-container *ngFor="let column of columns; first as isFirst">
<ng-container *ngIf="isFirst; else notFirst" sticky></ng-container>
<ng-template #notFirst></ng-template>
</ng-container>
uj5u.com熱心網友回復:
<ng-container>將不存在于 DOM 中。它僅用于回圈遍歷專案并動態生成一些內容。所以如果你sticky直接對它應用指令,它不會有任何效果。但是您可以將sticky指令應用于由<ng-container>. 我建議你<div>在里面添加一個<ng-container>作為內容的包裝器并對其應用sticky指令。此外,您可以使用first變數 of*ngFor將sticky指令僅應用于第一個元素。
<ng-container *ngFor='let column of columns; let first as first'>
<div *ngIf="first" sticky>
<!--Your actual content-->
<div>
<div *ngIf="!first">
<!--Your actual content-->
<div>
</ng-container>
uj5u.com熱心網友回復:
您可以為此使用索引:
<ng-container *ngFor="let column of columns; let i = index">
<div *ngIf="i=0" sticky></div>
<div *ngIf="i!=0"></div>
</ng-container>
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/345440.html
標籤:javascript 有角的 打字稿
