Mandar Shinde

Mandar Shinde

  • 1.5k
  • 346
  • 11.7k

Regarding multiple mat autocomplete.

Jul 31 2019 5:43 AM
Dear all,
Hope you are doing well. I am facing one problem whicle creating one component in Angular 6 and ASP .Net MVC with Rest API.
I have a table structured form and in last column there a button add new. 
If i click on that button then I am creating another row using ngFor.
 
  1. <tr *ngFor="let item of itemsList ; let i = index; ">  
  2. <td>  
  3.   <mat-form-field class="container-fluid" style="padding: 0px;">  
  4.   <!-- ADD AN INPUT BOX OF TYPE TEXT AND LINK IT TO THE AUTO COMPLETE PANEL. -->  
  5.  <input type="text" matInput [formControl]="searchTerm" id="filter{{i}}"   
  6.  name="filter{{i}}" [(ngModel)]="product[i]" [matAutocomplete]="auto">   
  7. <!-- CREATE AUTO COMPLETE PANEL WITH OPTIONS. -->  
  8.  <mat-autocomplete #auto="matAutocomplete">  
  9.  <mat-option  *ngFor="let item of productlist" [value]="item.ItemName">  
  10.    {{ item.ItemName }}  
  11.  </mat-option>  
  12.  </mat-autocomplete>  
  13.  </mat-form-field>  
  14.  </td>  
  15. <td>  
  16.   <button (click)="AddNewRow()">AddRow</button>  
  17. </td>  
  18. </tr>  
my problem is that I am not able to keep hold those values selected in auto completer.
Please let me know if anyone have an easy solution.
Thanking in advanced.
Regards. 

Answers (1)