title: Unable to add ngModel directive to angular material autocomplete
body: <p>I want to add an autocomplete field to a page in my angular app.</p>
  
  <p>I added below in my template.</p>
  
  <pre><code>&lt;mat-form-field class="example-full-width"&gt;
      &lt;input matInput placeholder="Pick one" [(ngModel)]="entity.type" [matAutocomplete]="auto"&gt;
      &lt;mat-autocomplete #auto="matAutocomplete"&gt;
          &lt;mat-option *ngFor="let option of options" [value]="option"&gt;
              {{option}}
          &lt;/mat-option&gt;
      &lt;/mat-autocomplete&gt;
  &lt;/mat-form-field&gt;
  </code></pre>
  
  <p>But, I get following error when I navigate to the page.</p>
  
  <blockquote>
    <p>ERROR Error: More than one custom value accessor matches form control
    with unspecified name attribute</p>
  </blockquote>
  
  <p>Error goes away if I remove <code>[(ngModel)]="entity.type"</code> directive from the template.</p>
  
  <p>What is the reason for this error? Is there any way I can fix it?</p>
  
  <p><a href="https://stackblitz.com/edit/angular-jaj4da" rel="nofollow noreferrer">Here is a stackblitz</a> for the issue. Error is shown in the console, which can be opened from the right bottom of the page.</p>