bug(MatAutocomplete): MatAutocomplete + FormControl does not clear input correctly after option selection
- Langage dominant
- TypeScript
- Étoiles
- 25k
- Forks
- 6.8k
- Merge moyen
- 1 j 8 h
- PR mergées (30 j)
- 91
Description
### Is this a regression?
- [ ] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
_No response_
### Description
See example: https://material.angular.io/components/chips/examples#chips-autocomplete
In this example, after selecting an autocomplete option, we want to create a new chip and clear the typed text in the input element. The input is bound to a FormControl instance, so it should be possible to clear the input by simply calling `this.fruitCtrl.setValue(null)` or `this.fruitCtrl.setValue('')`. Instead, the previously typed text remains visible, but if you subscribe to the `FormControl.valueChanges` property you will see the new empty value emitted correctly.
The example works around this issue by accessing the native input element and updating the value directly.
### Reproduction
Steps to reproduce:
1. See example https://material.angular.io/components/chips/examples#chips-autocomplete
2. Remove the nativeElement reference
3. Input text remains visible despite the FormControl instance correctly emitting the new value, creating an inconsistent state
### Expected Behavior
It should be enough to just update the FormControl to ensure the input element has the correct value set.
### Actual Behavior
The input element is left in an inconsistent state unless the user manually updates the native element's value directly.
### Environment
- Angular: n/a (internal stable version http://go/ng-cli)
- CDK/Material: n/a
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): macOS
Guide de contribution
Ouvrir le guide de contribution
Piste de recherche
Commencez par l’exemple de chips-autocomplete lié dans l’issue et reproduisez le comportement avec MatAutocomplete et un FormControl. Suivez la manière dont la valeur vide du contrôle atteint le champ de saisie après la sélection d’une option ; le travail est terminé lorsque la mise à jour du FormControl seul efface le texte visible sans accès direct à nativeElement.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- angular, typescript
- Domaine
- frontend
- Type d'issue
- Bug
- Difficulté
- 3/5
- Temps estimé
- 1-2 jours
- Activité
- À l'abandon
- Clarté
- Plutôt claire
- Accessibilité débutants
- 35/100