bug(MatAutocomplete): Resetting the input value doesn't reset the selected autocomplete value

[micobarac]

Is this a regression?

• [ ] Yes, this behavior used to work in the previous version

Description

Resetting the input value doesn't reset the selected autocomplete value. Dropdown should be deselected along with input field reset.

This problem was present and reported in several previous versions (14, 15 and 16), claiming that it was fixed, but the problem still remains.

https://github.com/angular/components/issues/27861 https://github.com/angular/components/issues/26761

Reproduction

StackBlitz link: https://stackblitz.com/edit/qau9h1 Steps to reproduce:

1. Choose any value from autocomplete
2. Click Reset button
3. Open the autocomplete dropdown and confirm the previously selected option is still selected

Expected Behavior

Autocomplete dropdown should be deselected after the input control is reset

Actual Behavior

Autocomplete dropdown's previously selected option is still selected after resetting the input control

Environment

• Angular: 17.0.1
• CDK/Material: 17.0.0
• Browser(s): Google Chrome 119.0.6045.105 (Official Build) (arm64)
• Operating System (e.g. Windows, macOS, Ubuntu): macOS Sonoma 14.0 (23A344)

[vkaelin]

Same issue here, any idea how to do a temporary fix?

[imukeshsoni]

I'm also facing the same issue.

[arroket]

Have the same issue. Temporary fix that worked for me: stackblitz

export class AutocompleteFilterExample implements OnInit {
  @ViewChild(MatAutocomplete) autocomplete!: MatAutocomplete;

in your reset method just add this line

this.autocomplete.options.first.deselect();