Oproep van 'n komponent in 'n lus in Angular

Jy kan ook 'n komponent in 'n lus oproep, deur verskillende parameters aan hom in kenmerke oor te dra. Kom ons probeer dit in die praktyk. Laat ons die volgende eienskap met gebruikers hê:

app/user/user.component.tsinterface User {
  name: string,
  age: number
}

class UserComponent {
  public users: User[] = [
    {
      name: 'user1',
      age: 25,
    },
    {
      name: 'user2',
      age: 26,
    },
    {
      name: 'user3',
      age: 27,
    },
  ]; 
}

Laat ons deur die gebruikers itereer met 'n lus, en in elke iterasie 'n kindkomponent oproep met die gebruiker en die naam en ouderdom as parameters aan hom oor te dra:

app/app.component.html<div *ngFor="let user in users">
  <user-data [name]="user.name" [age]="user.age"></user-data>
</div>

typescriptinterface Product {
  name: string,
  cost: number
}

class ProductComponent {
  public products: Product[] = [
    {
      name: 'prod1',
      cost: 100,
    },
    {
      name: 'prod2',
      cost: 200,
    },
    {
      name: 'prod3',
      cost: 300,
    },
  ]; 
}