angular - 如果值为空，则更新 formGroup 值

Question

我有一个有角度的项目，它的表单带有不同数量的表单控件。这是我的模板的外观：

<form [formGroup]="updateValuesForm">
   <div *ngFor="let controlName of updateValuesForm.controls | keys">
      <input [formControlName]=controlName type="text">
   </div>
</form>

这按预期工作。我现在正在尝试实现以下内容：如果控件值为空，则该值应更改为 ，该值不应显示在表单中（因为最终用户不会理解这意味着什么）。这甚至可以在 Angular 形式中实现吗？

Answer 1

试试这个，而不是在输入为空时更改输入的值，只需在提交表单时在处理之前更改数据的值。这将确保用户看不到 .

HTML

<form [formGroup]="updateValuesForm" (ngSubmit)="submitForm(updateValuesForm.value)">
    <div *ngFor="let controlName of updateValuesForm.controls | keys">
       <input [formControlName]=controlName type="text">
    </div>
</form>

打字稿

submitForm(data: any) {

    for (var value in data) {
        if (!data[value]) {
            data[value] = ' ';
        }
    }

    // Handle Form Submission

}