我注意到如果我在Angular 2反应形式上禁用控件,那么控件不会包含在form.value中。例如,如果我定义我的表单如下:
this.notelinkingForm = new FormGroup({
Enabled: new FormControl(settings.Enabled, Validators.required),
LinkToPreceeding: new FormControl({value: settings.LinkToPreceeding, disabled: !settings.Enabled}, Validators.required),
LinkingTolerance: new FormControl({value: settings.LinkingTolerance, disabled: !settings.Enabled}, Validators.required)
});
并检查this.notelinkingForm.value,如果启用了所有控件,则输出为:
{"Enabled":true, "LinkToPreceeding": true, LinkingTolerance:"100"}
但是,当某些控件被禁用时,它将是:
{"Enabled":true}
请注意如何排除禁用的控件。
我的意图是,当表单更改时,我希望能够将form.value与其中的所有属性一起传递给我的rest API。如果它不包含禁用的项目,这显然是不可能的。
我在这里遗漏了什么或者这是预期的行为吗?有没有办法告诉Angular在form.value中包含禁用的项目?
欢迎你的想法。
答案 0 :(得分:141)
答案 1 :(得分:4)
我使用的另一个选项是:
this.form.controls['LinkToPreceeding'].value;
答案 2 :(得分:4)
@Sasxa谢谢您为我提供了80%的所需资源。
对于那些正在寻找相同问题的解决方案但对于嵌套表格的人,我可以通过更改常规方法来解决
this.notelinkingForm.get('nestedForm').value
到
this.notelinkingForm.getRawValue().nestedForm
答案 3 :(得分:0)
如果您使用readonly
而非disabled
,则该数据仍将不可编辑,因为数据将包含在表单中。但这并非在所有情况下都可行。例如。它不适用于单选按钮和复选框。参见MDN web docs。在这种情况下,您必须申请此处提供的其他解决方案。