bug(matFormField): Form field state not being updated properly when input dynamically changes
- Lenguaje dominante
- TypeScript
- Estrellas
- 25k
- Forks
- 6.8k
- Merge medio
- 1 d 8 h
- PR fusionados (30 d)
- 91
Descripción
### Is this a regression?
- [x] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
version 14
### Description
When dynamically changing the input type of a form field, the label and error state of the for field is not properly reflected, the label will not float up and the form outline color will not be set. [See demo example](https://stackblitz.com/edit/nmqf81?file=src%2Fexample%2Fform-field-hint-example.html)
Confirmed that id used to work properly in version 14 [see demo working](https://stackblitz.com/edit/vaqmlj?file=src%2Fapp%2Fform-field-overview-example.ts,src%2Fapp%2Fform-field-overview-example.html)
### Reproduction
Steps to reproduce:
1. open [demo](https://stackblitz.com/edit/nmqf81?file=src%2Fexample%2Fform-field-hint-example.html)
2. toggle slider
3. click submit
4. see that label has not floated and form outline is not red
5. open v14 demo and see it working properly [stackblitz](https://stackblitz.com/edit/vaqmlj?file=src%2Fapp%2Fform-field-overview-example.ts,src%2Fapp%2Fform-field-overview-example.html)
### Expected Behavior
Form field should allow inputs to dynamically change
### Actual Behavior
Error state and label are not propely reflected
### Environment
- Angular: 17
- CDK/Material: 17
Guía de contribución
Línea de trabajo
Comienza con la reproducción enlazada de StackBlitz y compara su comportamiento en Angular 17 con la demo proporcionada de la versión 14, mientras sigues los cambios de estado del form-field de Angular Material. Reproduce el cambio dinámico del tipo de input y el flujo de envío; se considera terminado cuando la etiqueta flota y el contorno del formulario refleja el estado de error después de que cambie el input.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- angular, typescript
- Área
- frontend
- Tipo de issue
- Error
- Dificultad
- 3/5
- Tiempo estimado
- 1-2 días
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 35/100