angular 禁用表单控件会导致“检查后更改”错误

isr3a4wc  于 2022-10-29  发布在  Angular
关注(0)|答案(1)|浏览(99)

我正在提交...

[ ] Regression (behavior that used to work and stopped working in a new release)
[x] Bug report 
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

当前行为

MyComponent有一个disabled Input属性和一个valueChange Output属性。用户有时希望在处理valueChange事件后禁用组件。将组件的[disabled]属性设置为true会正确地导致其子input元素发出blur事件。然后调用onTouched,这将更改导致ExpressionChangedAfterItHasBeenCheckedError的ng-touched绑定。只有在使用ngModel绑定时才会发生这种情况。

预期行为

不应引发ExpressionChangedAfterItHasBeenCheckedError。

最大限度地减少了使用说明时问题的重现

重现步骤:
1.聚焦输入元素
1.更改文本
1.按Enter键
DEMO HERE的最大值

改变行为的动机/用例是什么?

理想情况下,使用ngModel绑定不应破坏使用[value](valueChange)绑定的方案。使用超时或手动更改检测是合理的,但这些都是解决突出问题的变通办法。

请告诉我们您的环境

Angular version: 4.2.3

Browser:
- [x] Chrome (desktop) version 58.0.3029.110
- [?] Chrome (Android) version XX
- [?] Chrome (iOS) version XX
- [ ] Firefox version 53.0.2 
- [?] Safari (desktop) version XX
- [?] Safari (iOS) version XX
- [x] IE version 11.962**PRESSING ENTER DOES NOT TRIGGER CHANGE**
- [ ] Edge version 25.1 / 13.10
toiithl6

toiithl61#

我在这里补充一下,这是一个影响Angular Material的真实的问题。这个问题源于blur事件被触发并立即处理(在更改检测期间)。

相关问题