การวนซ้ำลำดับคี่ใน Angular
เมื่อวนลูปผ่าน *ngFor และ @for
คุณสามารถระบุการวนซ้ำลำดับคี่ของลูปได้
ด้วยตัวแปร odd
ตัวอย่างสำหรับ directive *ngFor:
<ul>
<li *ngFor="let el of arr; let odd = odd">
{{ odd ? 'คี่' : 'ไม่ใช่' }}
{{ el }}
</li>
</ul>
ตัวอย่างสำหรับโครงสร้าง @for:
<ul>
@for (el of arr; track $index) {
<li>
{{ $odd ? 'คี่' : 'ไม่ใช่' }}
{{ el }}
</li>
}
</ul>
กำหนดอาร์เรย์:
export class AppComponent {
public arr: string[] = ['a', 'b', 'c', 'd'];
}
แสดงองค์ประกอบของอาร์เรย์ในรูปแบบรายการ
ul โดยให้ li ลำดับคู่มี
สีแดง และลำดับคี่มีสีเขียว