Фаромӯхтани компонент дар давр дар Angular

Инчунин мумкин аст компонентро дар давр фаро хонед, ба он дар хусусиятҳо гуногун мегузаронед параметрҳо. Биёед дар амал санҷем. Бигзор мо хосияти зеринро бо корбарон дошта бошем:

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,
    },
  ];
}

Корбаронро бо давр такрор кунем, дар ҳар як такрор компоненти фарзандро бо корбар фаро хонда ва ба он ном ва синну солро параметрҳо гузаронем:

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,
    },
  ];
}