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