title: select autocomplete set value ngModel programmatically on edit form
body: <p>When I get to the edit form I need to prefill the values to the form.</p>
  
  <p>the create form works fine and the values are submitted fine,</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!-- customers--&gt;
  &lt;div class="col-md-6"&gt;
    &lt;mat-form-field class="example-full-width"&gt;
      &lt;input type="text"
             placeholder="Customers"
             i18n-placeholder="customerInput"
             aria-label="customers"
             matInput
             required
             [name]="'customerId'"
             (focus)="getCustomers(searchedCustomer)"
             [ngModel]="contractInterface.customerName"
             (ngModelChange)="customerOnChange($event)"
             [matAutocomplete]="autoCustomer"&gt;
      &lt;mat-autocomplete #autoCustomer="matAutocomplete" [displayWith]="customerCollectionDisplayFn"&gt;
  
        &lt;mat-option *ngIf="customerloading"&gt;&lt;span [ngTemplateOutlet]="loading"&gt;&lt;/span&gt;&lt;/mat-option&gt;
  
        &lt;ng-container *ngIf="!customerloading"&gt;
          &lt;mat-option *ngFor="let customer of customerList" [value]="customer"&gt;
            {{ customer.name }}
          &lt;/mat-option&gt;
        &lt;/ng-container&gt;
      &lt;/mat-autocomplete&gt;
    &lt;/mat-form-field&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I use the <code>[displayWith]="customerCollectionDisplayFn"</code> to display the value to the input</p>
  
  <p>TS:</p>
  
  <pre><code>  customerCollectionDisplayFn(customer?) {
  return customer?.name;
  }
  </code></pre>