ไปดูการโชว์ข้อมูลที่เป็น list ใน angular กัน

ซึ่งในการโชว์ข้อมูลที่เป็น list นั้นเราจะใช้ *ngFor ในการแสดงตามจำนวน array ของข้อมูล ตามตัวอย่าง

<ul>
  <li *ngFor="let item of items">{{ item }}</li>
</ul>

เรายังสามารถใช้ async เพื่อ handle asynchronous data ตามตัวอย่าง

<ul>
  <li *ngFor="let item of items | async">{{ item }}</li>
</ul>

ตัวอย่างอื่น ๆ

<div *ngFor="let item of items">
  {{ item }}
</div>

ตัวอย่างโค้ดแบบเต็ม

export class MyComponent {
  data = [
    {id: 1, name: 'Item 1'},
    {id: 2, name: 'Item 2'},
    {id: 3, name: 'Item 3'}
  ];
}

<ul>
  <li *ngFor="let item of data">
    {{ item.name }}
  </li>
</ul>