如何为非必需的 FormGroup 定义必需的 FormControl？

Question

在我的应用程序中，我有一个 FormGroup 不需要提交表单，但是，如果用户尝试填写该组的任何部分，则需要存在特定字段在其中，否则该组应被视为无效。

有没有办法为非必需字段定义必需字段 FormGroup 以便我可以保证数据完整性？

这是我的群组

FormGroup({
    officeId: new FormControl("", [Validators.required]),
    fileOwner: fileOwner,
    secondaryOwner: secondaryOwner,
    managedByPrimary: new FormControl(true, [Validators.required])
});

这是我的 FileOwner FormGroup，我已将其标记为 required 组

let fileOwner: FormGroup = new FormGroup({
    FirstName: new FormControl("", [Validators.required]),
    LastName: new FormControl("", [Validators.required]),
    IdentificationNumber: new FormControl("", [Validators.required]),
    PhoneNumber: new FormControl(""),
    EmailAddress: new FormControl("")
}, [Validators.required]);

在这里我试图或多或少地说这个组是提交表格所必需的，在这个组中 FirstName、LastName 和 IdentificationNumber 是必填。

SecondaryOwner 与此密切相关，因为它是具有不同验证要求的同一模型

let secondaryOwner: FormGroup = new FormGroup({
    FirstName: new FormControl("", [Validators.required]),
    LastName: new FormControl("", [Validators.required]),
    IdentificationNumber: new FormControl("", [Validators.required]),
    PhoneNumber: new FormControl(""),
    EmailAddress: new FormControl("")
});

这里我没有把组设为必填项，但是指明了特定的字段是必填项。我的意图是或多或少地说，"This group isn't required, but if you fill it out these are necessary fields for the group to be considered valid"

我将如何完成这种行为？现在 SecondaryOwner 实例化为 Invalid 这是有道理的。但本质上，除非它的任何一个控件变脏，否则我不希望它被考虑用于验证。

Answer 1

我建议动态更新表单。让表格所需的状态受其他东西影响。这里有一些想法：

在没有需要的验证器的情况下启动表单并监听表单事件'dirty'或者在表单中添加一个点击事件，当用户点击它时，将表单验证器更改为'required'..
添加一个单独的输入或按钮，用户可以点击说 'yes I want to complete this form' 或任何你喜欢的，然后如果用户决定填写它，你可以在表单上有一个 ngIf .或者您可以像上面那样处理所需的验证器，但使用此外部输入。
如果您只想在用户实际输入数据时要求表单，请在更改事件中侦听表单值。添加值后，将表单更新为必填项。

在任何一种情况下，您的表单所需的功能可能如下所示：

requireForm() {
    this.myForm.setValidators(Validators.required)
}

你也可以看看

如何为非必需的 FormGroup 定义必需的 FormControl？

How to define required FormControls for non-required FormGroup?

angular

typescript

angular-forms