Is there a way to disable typing for autocomplete? - Angular Material

user_10821284 0
Viewed 11760

I have the following autocomplete in Angular material:

 <!-- Drop Down menu -->
          <mat-form-field>
            <input placeholder="Select one" [matAutocomplete]="auto" matInput>

            <mat-autocomplete #auto="matAutocomplete">
              <mat-option value="Cars">Cars</mat-option>
              <mat-option value="Books">Books</mat-option>
            </mat-autocomplete>
          </mat-form-field>

Is there a way to disable typing on the input so that the user does not defeat the purpose of the dropdown menu? Right now, the user can just type something instead of picking an option, or even edit an option when selected.

angular-material angular autocomplete
4 Answers
user_46837230
user_6400530

  1. If you want input field to disable all the time then use normal select drop down

  2. If you want to use auto complete but don't want user to edit selected option in input field then you might wanna use chips autocomplete - https://material.angular.io/components/chips/examples

user_79608460

Yes, you can. To do so, in the ngOnit function, disable the reactive form control for that field:

this.myControl.disable()
user_196413690
Related