Angular2 - Как поместить TextBox в * ngFor

Question

Я пытаюсь поместить текстовое поле в *ngFor Как

<tr *ngFor="let abc in _Apple">    
  <td>{{abc.Name}}</td>
  <td> <input matInput  name="UnitofPrice" [(ngModel)] = "UnitofPrice">
</td>
<td>{{UnitofPrice}}</td>

Если я введу что-либо в UnitofPrice, это будет отражено для всех.Как я могу удалить это?

Answer 1

Сделайте вашу модель NG уникальной с индексом ngFor: см. Пример:

<tr *ngFor="let abc in _Apple; let i = index;">

<td>{{abc.Name}}</td>
<td> <input matInput  name="UnitofPrice" [(ngModel)]="abc[i]">
</td>
<td>{{UnitofPrice}}</td>

в вашей кнопке или функции Submit, передайте это как параметр как:

<button (click)="yourFunc(abc[i])">submit</button>