与参考(https://stackoverflow.com/questions/50197347/how-to-reset-only-specific-fields-of-form-in-angular-5),我有20字段的形式,如果用户点击重置选项,我需要重置形式排除2字段,如果我使用这个.form.reset()意味着它重置每一件事,任何帮助赞赏
https://stackoverflow.com/questions/50197347/how-to-reset-only-specific-fields-of-form-in-angular-5
qgzx9mmu1#
看看onReset()方法,这段代码将重置除name和description字段之外的所有内容。
onReset()
name
description
formGroup: FormGroup = /* init the formGroup... */ onReset() { this.formGroup.reset({ name: this.formGroup.get('email').value, description: this.formGroup.get('description').value }); }
Stackblitz repro
zpjtge222#
您可以迭代FormGroup的控件,如果控件名称与排除列表中的控件名称匹配,则不重置它:
FormGroup
const exclude: string[] = ['formControlName1', 'formControlName2']; Object.keys(this.form.controls).forEach(key => { if (exclude.findIndex(q => q === key) === -1) { this.form.get(key).reset(); } });
busg9geu3#
你可以给reset函数提供一个reset值,只给予它两个字段的值,剩下的应该是空的。
const resetValue = {}; for (const key of this.form.value) { resetValue[key] = ''; } resetValue.firstFieldToKeep = this.form.get('firstFieldToKeep').value; resetValue.secondFieldToKeep = this.form.get('secondFieldToKeep').value; this.form.reset(resetValue);
qlckcl4x4#
您可以将一个对象传递给reset函数,其中Key作为formControl,value作为您希望控件在reset时具有的值。
this.form.reset({ fomrControl1:value1, formControl2:value2 });
如果你想改变字段的行为,比如禁用或启用,只需传入一个Object而不是一个值。例如:
this.form.reset({ fomrControl1:{value:value1, disabled:true}, // disables this field on reset formControl2:value2 });
kpbwa7wx5#
我会保留这两个输入值,重置表单,然后再次修补这两个。
const keepValues = [ this.form.controls.keepThis1.value, this.form.controls.keepThis2.value, ]; this.form.reset(); this.form.controls.keepThis1.patchValue(keepValues[0]); this.form.controls.keepThis2.patchValue(keepValues[1]);
jq6vz3qz6#
我们来创建一个函数reset(),并使用如下语法重置18字段。
18
resetForm(){ this.form.controls.formField1.reset(""); this.form.controls.formField2.reset(""); . . this.form.controls.formField18.reset(""); }
谢谢你。
dgsult0t7#
我遵循了一个快捷方式,我重置了完整的表单,然后我修补了一个不需要重置的控件的值。
onCancelClick(form: NgForm) { form.resetForm(); Object.keys(form.controls).forEach(name => { if (name == "email") { form.controls[name].patchValue(this.emailOfmember); } }); }
7条答案
按热度按时间qgzx9mmu1#
看看
onReset()
方法,这段代码将重置除name
和description
字段之外的所有内容。Stackblitz repro
zpjtge222#
您可以迭代
FormGroup
的控件,如果控件名称与排除列表中的控件名称匹配,则不重置它:busg9geu3#
你可以给reset函数提供一个reset值,只给予它两个字段的值,剩下的应该是空的。
qlckcl4x4#
您可以将一个对象传递给reset函数,其中Key作为formControl,value作为您希望控件在reset时具有的值。
如果你想改变字段的行为,比如禁用或启用,只需传入一个Object而不是一个值。例如:
kpbwa7wx5#
我会保留这两个输入值,重置表单,然后再次修补这两个。
jq6vz3qz6#
我们来创建一个函数reset(),并使用如下语法重置
18
字段。谢谢你。
dgsult0t7#
我遵循了一个快捷方式,我重置了完整的表单,然后我修补了一个不需要重置的控件的值。