0

我需要为 Angular 模板驱动的表单编写自定义验证器,其中任何一个非空输入都足以使表单有效。

考虑以下带有两个输入字段和提交按钮的 Angular 表单:

<form name="myform" (ngSubmit)="userForm.form.valid && saveData()" #userForm="ngForm" novalidate>

    <input type="text"
        [(ngModel)]="phoneNumber"
        name="phoneNumber"
        #phoneNumber="ngModel"
        pattern="\+[1-8]{1-3}\([0-9]{3}\)[0-9]{7}" />

    <input type="text"
        [(ngModel)]="privateEMail"
        name="privateEMail"
        #privateEMail="ngModel"
        pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,6})+$" />

    <button type="submit" [disabled]="!userForm.form.valid">Submit</button>

</form>

要求 - 如果两个输入中的任何一个不应该为空,则使表单有效(除了输入模式验证)。为输入控件编写自定义验证器是没有意义的——它只会受到其自身值范围的限制。订阅表单事件statusChanges还需要注意 - 此信息是只读的。何时编写控件自定义验证器(如输入控件)并将其应用于表单然后它将不起作用 - 它似乎不会被表单调用。

为 Angular 模板驱动的表单编写自定义验证器的正确方法是什么?

4

0 回答 0