title: Clear Angular Material autocomplete on click
body: <p>Hi I want reset value of angular material autocomplete on click
  But I don't know how do.</p>
  
  <p>My code : </p>
  
  <pre><code>  &lt;mat-form-field&gt;
          &lt;input type="text" placeholder="Give Rights" formControlName="selectedOption" aria-label="User" matInput  [matAutocomplete]="auto" (input)="onSearchChange($event.target.value)"&gt;
          &lt;mat-autocomplete #auto="matAutocomplete"&gt;
              &lt;mat-option *ngFor="let user of users" [value]="user.displayName" (onSelectionChange)="setSelectedUser($event, user)"&gt;
                  {{ user.displayName }}
              &lt;/mat-option&gt;
          &lt;/mat-autocomplete&gt;
          &lt;button (click)="resetValue($event)"&gt;RESET&lt;/button&gt;
      &lt;/mat-form-field&gt;
  </code></pre>
  
  <p>TS : </p>
  
  <pre><code>    this.nameForm = this._formBuilder.group({
      selectedOption: new FormControl()
  });    
  
      resetValue(){
      console.log("Value -&gt; ", this.nameForm.value.selectedOption);
      this.nameForm.value.selectedOption = "test";
  }
  </code></pre>
  
  <p>Can you help me ?</p>