angular / angular/components

form-field(select): with matNativeControl and outline where one field relies upon the value of another

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

描述

#### Reproduction

Open StackBlitz, and try to select different options, open dev tools and see errors: https://angular-jjb9g7.stackblitz.io

Steps to reproduce:
1. Add two `mat-form-field` with `appearance="outline"`
2. Add `` to each one
3. Make that second field select dynamically get options after first field value changed


#### Expected Behavior

First field changes value and second field get new options

#### Actual Behavior
First field changes value and second field get new options and errors at console are shown:
```ts
ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.
Previous value: 'mat-form-field-should-float: false'.
Current value: 'mat-form-field-should-float: true'.
```

#### P.S. If delete appearance="outline", no errors are shown.

#### Environment

- Angular: 7.2.0
- Material: 7.3.7 and 8.2.3
- Browser(Chrome Version 74.0.3729.108 (Official Build) (64-bit)):
- Operating System (Ubuntu 18.04):

贡献指南

打开贡献指南

调研方向

从链接的 StackBlitz 复现开始,检查使用 matNativeControl 的两个带轮廓的 mat-form-field 元素。在观察控制台是否出现 ExpressionChangedAfterItHasBeenCheckedError 的同时,复现依赖 select 的更新。完成标准是:第一个字段发生更改后,第二个字段能够更新且不出现所报告的错误,同时保留 outline 外观。

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

评估

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

把新 issue 发到你的邮箱

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