如何重置表单中的特定字段？

Question

如何只重置一个字段而不是整个表单？这样当字段被重置时，它得到的值是 ''，而不是 null

 clear(): void {
    this.form.value.search = '';
    // this.form.reset();
    this.applyFilter();
  }

Answer 1

从窗体中提取控件，并使用 '' 在其上调用 reset。

clear(): void {
    this.form.get('value')?.reset('');
    this.applyFitler();

  }

Answer 2

假设您正在使用 HTML，您要做的就是传递一个 HTMLInputElemenet，如下所示：

clear(field: HTMLInputElement): void {
    field.value = '';
  }

你必须这样命名你的字段：

<input
   type="text"
   placeholder="Total"
   #field
/>

看#的名字，一定和你传入函数的名字一样。

Answer 3

clear(formControlName): void {
  this.form.patchValue({
    formControlName : ''
   })
  }

您可以像这样创建一个通用函数，并将 form-control 名称作为函数的参数传递

Answer 4

您可以使用

重置表单域

this.form.get("value").reset("");

或者您可以创建一个通用函数，当您调用它并将字段名称作为参数传递给它时，会将字段重置为空字符串

resetFieldToEmptyString(FieldName:string) {
  this.form.get(FiledName).reset("")
}

How do reset a specific field in form?