title: angular material autocomplete prevents reactive from setValue from working
body: <p>Edit:
  Resolved with Jojofoulk's comment.</p>
  
  <p>when using the autocomplete components of angular-material,
  I'm trying to use <code>setValue</code> to the input form, but its <code>[matAutocomplete]</code> attribute is preventing <code>setValue</code> from showing on the input.</p>
  
  <p>Inspecting the reactive control reveals the value is right, and removing <code>[matAutocomplete]</code> makes it work,
  but with it it's just not showing up.</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;mat-list-item role="listitem" *ngFor="let skill of curObj.skills;index as ind"&gt;
    &lt;div&gt;
      &lt;mat-form-field&gt;
        &lt;input type="text" placeholder="choose skill" aria-label="Number" matInput [formControl]="skill.control" [matAutocomplete]="auto"&gt;
        &lt;mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn" (optionSelected)="optSel($event.option.value,skill)"&gt;
          &lt;mat-option *ngFor="let option of skill.filteredOptions | async" [value]="option"&gt;
            {{option.name}}
          &lt;/mat-option&gt;
        &lt;/mat-autocomplete&gt;
      &lt;/mat-form-field&gt;
    &lt;/div&gt;
  &lt;/mat-list-item&gt;
  </code></pre>
  
  <pre><code>skill.control.setValue("some new value");
  </code></pre>