angular - Remove focus from mat-select after selection change

Question

In .html file i have selector:

<mat-form-field>
    <mat-select #selector(selectionChange)="onSelectionChange($event.value)">
      <mat-option *ngFor="let test of tests" [value]="test">
      </mat-option>
    </mat-select>
  </mat-form-field>

In .ts file I have:

  @ViewChild('selector', { static: false }) selector: MatSelect

  onSelectionChange(value: any) {
    this.selector.focused = false;
  }

It doesn't work because focused is read only parameter, but how to achieve this effect other way?

question from:https://stackoverflow.com/questions/65846278/remove-focus-from-mat-select-after-selection-change

Answer 1

MatSelect expose close method.

Try this:

 onSelectionChange(value: any) {
    this.selector.close();
  }