angular / angular/components

bug(Autocomplete): matAutocomplete with control initial value does not highlight value in options with check icon

Ouverte
#29,422 7 commentaires 13 réactions 0 personnes assignées Voir sur GitHub
area: material/autocomplete P3
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

A MatAutocomplete field initialized with a control value does not highlight item in options

### Reproduction

StackBlitz link: https://stackblitz.com/edit/saqfud?file=src%2Fexample%2Fautocomplete-filter-example.ts,src%2Fexample%2Fautocomplete-filter-example.html,src%2Fexample%2Fautocomplete-filter-example.css
Steps to reproduce:
1. Set initial value of control (second one value for example)
```
options: string[] = ['One', 'Two', 'Three'];
myControl = new FormControl(this.options[1]);
```
3. click on input on UI

### Expected Behavior

Second one option is highlighted
![image](https://github.com/angular/components/assets/60134428/1d2c8684-8dc5-42dc-8433-7051b02926f6)

### Actual Behavior

second option is not highlighted
![image](https://github.com/angular/components/assets/60134428/635ef0d6-bf94-4523-b8b3-38014f7c2356)

### Environment

- Angular:
- CDK/Material:
- Browser(s):
- Operating System (e.g. Windows, macOS, Ubuntu):

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par exécuter la reproduction StackBlitz liée et inspectez src/example/autocomplete-filter-example.ts ainsi que src/example/autocomplete-filter-example.html. Confirmez qu’une valeur est initialement sélectionnée, mais que son option n’est pas mise en surbrillance lorsque le champ de saisie s’ouvre. C’est terminé lorsque la deuxième option est systématiquement mise en surbrillance pour la valeur initiale de FormControl fournie, avec un test de régression couvrant ce comportement.

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
38/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.