Question

我可以用值初始化FormGroup，并且不让值反映在模型中，以便输入字段在开始时显示为空白吗？

我有一个formGroup，如下所示：

this.fg = this.fb.group({
  saleValue: 0,
  letValue: 0
});

与我的模型绑定的方式如下：

<form [formGroup]="fg">
  <input formControlName="saleValue" />
  <input formControlName="letValue" />
</form>

如果用户未输入销售/租赁价值，则应将其作为0提交给服务器-因此使用formGroup进行初始化。

但是，我不希望此0显示在输入字段中。因此，当我使用getValue()提交表单时，将根据需要设置我的值。有没有办法做到这一点？

我担心我将需要手动执行并将FormGroup控件初始化为null，并检查两个控件的值和setValue(0)是否仍为null ...

Answer 1

我认为您应该这样做

this.fg = this.fb.group({
  saleValue: '',
  letValue: ''
});

以表单标记

<form [formGroup]="fg" (ngSubmit)="onSubmitFunction(fg)" >
  <input formControlName="saleValue" />
  <input formControlName="letValue" />
</form>

和提交功能..

onSubmitFunction (form) {
  if (!form.value.saleValue) form.value.saleValue = 0
  if (!form.value.letValue) form.value.letValue= 0

// and then submit the form 
}

Answer 2

依靠虚假值。

this.fg = this.fb.group({
  saleValue: 0,
  letValue: 0
});

submit() {
  ...
  const value = this.fg.value;
  this.setDefaultValues(value);
  ...
}

setDefaultValues(formValue) {
  formValue.saleValue = formValue.saleValue || 0;
  formValue.letValue = formValue.letValue || 0;
}

使用此解决方案，如果输入为假（undefined，null或''），则该值将替换为零。

反应性FormGroup隐藏的默认值

2 个答案: