我正在使用 ngFor 從兩個陣列創建一個表
<tr *ngFor="let e of lis1; let k=index">
<td>{{e}} </td>
<td>{{lis2[k]}}</td>
</tr>
創建的表是這樣的
Name Age
a 15
b 20
c 25
我想更改年齡大于 20 的行的顏色。如何設定這個條件?我正在使用角度打字稿。
在 lis1 我有一個名稱陣列(a,b,c),在 lis2 我有一個年齡陣列(15,20,25)
uj5u.com熱心網友回復:
有不同的方法可以有條件地向元素添加樣式,ngStyle, ngClass, 直接使用屬性等。
我將向您展示如何使用ngClass. 您可以簡單地檢查年齡是否大于 20 歲[ngClass]以申請該課程,否則不是。
<tr *ngFor="let e of lis1; let k=index" [ngClass]="{'background-red': lis2[k] > 20}">
<td>{{e}} </td>
<td>{{lis2[k]}}</td>
</tr>
在您的CSS組件中簡單地添加類
.background-red{
background-color: red;
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/436736.html
下一篇:使用服務檔案角度保存資料
