title: FormControl is not provided by any applicable directives
body: <p>FormControl is having difficulties with directives...</p>
  
  <p>I am trying to implement an autocomplete into my input field. I am using the following angular-material guide to the point that I have verbatim copy and pasted their typescript and html to test it out: <a href="https://material.angular.io/components/autocomplete/overview" rel="nofollow noreferrer">https://material.angular.io/components/autocomplete/overview</a>.</p>
  
  <p>I keep receiving an error on FormControl in the HTML that reads: "Property FormControl is not provided by any applicable directives nor by input element.  Inspection info: Reports undefined property, event or structural directive bindings on elements."</p>
  
  <pre><code> HTML CODE:
  
   &lt;form class="example-form"&gt;
    &lt;mat-form-field class="example-full-width"&gt;
      &lt;input type="text" placeholder="Pick one" aria-label="Number" matInput [FormControl]="myControl" [matAutocomplete]="auto"&gt;
      &lt;mat-autocomplete #auto="matAutocomplete"&gt;
        &lt;mat-option *ngFor="let option of filteredOptions | async" [value]="option"&gt;
          {{option}}
        &lt;/mat-option&gt;
      &lt;/mat-autocomplete&gt;
    &lt;/mat-form-field&gt;
  &lt;/form&gt;
  
   TS CODE:
  
   import {Component, OnInit} from '@angular/core';
   import {FormControl} from '@angular/forms';
   import {Observable} from 'rxjs';
   import {map, startWith} from 'rxjs/operators';
  
   @Component({
     selector: 'mySelector',
     templateUrl: 'myTemplate.html',
     styleUrls: ['myCSS.css'],
   })
   export class myExportClass implements OnInit {
     myControl = new FormControl();
     options: string[] = ['One', 'Two', 'Three'];
     filteredOptions: Observable&lt;string[]&gt;;
  
     ngOnInit() {
       this.filteredOptions = this.myControl.valueChanges
         .pipe(
           startWith(''),
           map(value =&gt; this._filter(value))
         );
     }
  
     private _filter(value: string): string[] {
       const filterValue = value.toLowerCase();
  
       return this.options.filter(option =&gt; 
   option.toLowerCase().includes(filterValue));
     }
   }
  </code></pre>