angular - 使用多个 mat-autocomplete 时无法获取值

Question

在使用 Rest API 在 Angular 6 和 ASP .Net MVC 中创建一个组件时，我遇到了一个问题。我有一个表格结构的表格，在最后一列有一个“添加新”按钮。如果我单击该按钮，那么我将使用 ngFor 创建另一行。我的问题是我无法保留在自动完成器中选择的那些值（产品名称）。如果有人有简单的解决方案，请告诉我。提前致谢。问候。

<tr *ngFor="let item of itemsList ; let i = index; ">  
<td>  
  <mat-form-field class="container-fluid" style="padding: 0px;">  
  <!-- ADD AN INPUT BOX OF TYPE TEXT AND LINK IT TO THE AUTO COMPLETE PANEL. -->  
 <input type="text" matInput [formControl]="searchTerm" id="filter{{i}}"   
 name="filter{{i}}" [(ngModel)]="product[i]" [matAutocomplete]="auto">   
<!-- CREATE AUTO COMPLETE PANEL WITH OPTIONS. -->  
 <mat-autocomplete #auto="matAutocomplete">  
 <mat-option  *ngFor="let item of productlist" [value]="item.ItemName">  
   {{ item.ItemName }}  
 </mat-option>  
 </mat-autocomplete>  
 </mat-form-field>  
 </td>  
<td>  
  <button (click)="AddNewRow()">AddRow</button>  
</td>  
</tr>  

标签： angularmat-autocomplete