Btukfyl

I want to execute function in typescript on any key pressing by user. For example, if the drop down contains values like 'Apple', 'Pineapple', 'Mango' and if user press 'M', focus should be get to the 'Mango' as per the standard HTML behaviour. Standard HTML behaviour for is : https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_select

I have added (keypress) to the mat-select in html code. But it seems that keypress is not working as code in typescript function is not getting executed.
Angular version is 4.

below is the angular code:

<mat-form-field>

    <mat-select (keypress)="selectKeyPress($event)" placeholder="State" formControlName = "state" required id="stateDrop">

        <ng-container *ngFor = "let item of stateList">

            <mat-option [value] = "item.stateId">{{item.name}}</mat-option> 

        </ng-container>

    </mat-select>

    <mat-error *ngIf="(form.controls['state'].invalid && form.controls['state'].touched)">You must select a state.</mat-error>

</mat-form-field>

I had searched on your question but better thing is founded to used autocomplete.
https://material.angular.io/components/autocomplete/overview

reference link : Using keyboard to select items in md-select