如何从Angular的FormGroup中获取禁用表单控件的值？

嘿，这个问题我之前也碰到过！其实是Angular表单的默认行为导致的——FormGroup.value只会返回处于启用状态的控件值，禁用的控件会被自动排除在外。不过别担心，有两种简单的方法可以拿到禁用控件role的值：

方法1：用getRawValue()获取完整表单值 #

Angular专门提供了这个方法来获取表单里所有控件的值，不管控件是不是禁用：

// 获取包含禁用控件的完整表单数据
const fullFormData = this.userForm.getRawValue();
console.log(fullFormData.role); // 这里就能输出'MyValues'啦

方法2：直接访问单个禁用控件的value #

如果你只需要role这一个禁用控件的值，也可以直接定位到这个控件然后取value：

const roleValue = this.userForm.get('role')?.value;
console.log(roleValue); // 同样能拿到你设置的'MyValues'

顺便说下为啥会这样 #

Angular设计FormGroup.value的时候，默认遵循常规表单提交逻辑——禁用的表单元素本来就不会被提交到后端，所以value会自动过滤掉这些控件。而getRawValue()就是专门用来满足需要获取完整表单状态（包括禁用控件）的场景。

另外你提到禁用控件不影响表单验证，这也是正常的：Angular默认会忽略禁用状态的控件验证。如果需要禁用控件也参与验证，得额外配置updateOn或者手动触发验证，但这就是另一个小问题啦～

内容的提问来源于stack exchange，提问作者Oleksandr Oleksiv