angular / angular/components

bug(matFormField): Form field state not being updated properly when input dynamically changes

未关闭
#28,495 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
area: material/form-field P3
主要语言
TypeScript
星标
25k
派生
6.8k
平均合并
1 天 8 小时
30 天内合并 PR
91

描述

### 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

贡献指南

打开贡献指南

调研方向

从链接的 StackBlitz 复现开始,将其在 Angular 17 中的行为与提供的 version 14 demo 进行比较,同时跟踪 Angular Material form-field 的状态变化。复现动态 input-type 切换和 submit 流程;完成的标准是,输入发生变化后 label 浮动,且表单 outline 反映 error 状态。

由索引模型根据 Issue 内容生成。

评估

技术栈
angular, typescript
领域
frontend
Issue 类型
缺陷
难度
3/5
预计耗时
1-2 天
活跃度
停滞
描述清晰度
基本清楚
新手友好度
35/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。