title: Angular mat-autocomplete - Dynamic add/delete item issue
body: <p>I'm trying to create a simple form with a dynamic number of <code>mat-autocomplete</code> fields. However, in some cases, the <strong>inputs' displayed values get lost</strong>.</p>
  
  <h2>Component's script</h2>
  
  <pre><code>export class AutocompleteSimpleExample {
    availableItems = [{name: 'item1'}, {name: 'item2'}];
    items = [{name: 'item1'}, {}];
  
    addItem() {
      this.items.push({});
    }
  
    deleteItem(i: number) {
      this.items.splice(i, 1);
    }
  
    displayObject(obj) {
      return obj ? obj.name : null;
    }
  }
  </code></pre>
  
  <h2>Component's view</h2>
  
  <pre><code>&lt;form&gt;
    &lt;mat-form-field *ngFor="let item of items; let i = index"&gt;
      &lt;input matInput [(ngModel)]="items[i]" [matAutocomplete]="itemAutocomplete" name="items[{{i}}]"&gt;
  
      &lt;mat-autocomplete #itemAutocomplete="matAutocomplete" [displayWith]="displayObject"&gt;
        &lt;mat-option *ngFor="let item of availableItems" [value]="item"&gt;{{item.name}}&lt;/mat-option&gt;
      &lt;/mat-autocomplete&gt;
  
      &lt;button mat-button mat-icon-button matSuffix type="button" (click)="deleteItem(i)"&gt;&lt;mat-icon&gt;close&lt;/mat-icon&gt;&lt;/button&gt;
    &lt;/mat-form-field&gt;
  
    &lt;button class="btnType01" mat-raised-button type="button" (click)="addItem()"&gt;&lt;mat-icon&gt;add&lt;/mat-icon&gt;Add Item&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <blockquote>
    <p>I've made a
    <a href="https://stackblitz.com/edit/angular-ciaqr5?file=app%2Fautocomplete-simple-example.ts" rel="nofollow noreferrer">StackBlitz</a>
    to showcase the issue. If you:</p>
    
    <ol>
    <li>Select an item in the second autocomplete field (e.g. <code>Item 2</code>)</li>
    <li>Remove the item from the first autocomplete field (using the <code>x</code> at the end of the field)</li>
    <li>Click <code>Add Item</code> to add another one</li>
    </ol>
    
    <p>The first autocomplete field will then show an empty value, instead of
    keeping the one it had.</p>
  </blockquote>
  
  <p>Could anyone help me figure out why the value is lost? Is this the wrong way of dealing with a dynamic number of autocomplete fields?</p>