提交时的Angular 2触发器表单验证

Question

我创建了一个带有角度2的表单,并添加了一些客户验证器.现在我想在用户点击提交按钮时触发表单验证.在我到目前为止发现的示例中,只要表单无效,我就会禁用提交按钮,但我希​​望始终启用提交按钮,当用户点击提交时,表单应该被验证.有谁知道我怎么能做这个工作,我应该使用哪种打字方法？我找到了updateValueAndValidity方法,但它似乎不适用于此方法.

Answer 1

如果您使用的是模板驱动表单,则可以使用以下语法:

<form #f="ngForm" (submit)="add(f.valid)" novalidate>
    <button type="submit">Save</button>
</form>

.TS

add(isValid: boolean){
   if(isValid){
       //do something
   }
}

您还可以在提交时添加一些错误,如下所示:

<form #f="ngForm" (submit)="add(f.valid)" novalidate>
    <label>Name</label>
    <div>
        <input [(ngModel)]="name" name="name" #name="ngModel" required>
    </div>
    <div[hidden]="name.valid || (name.pristine && !f.submitted)">
        <small class="text-danger">Please input name</small>
    </div>
    <button type="submit">Save</button>
</form>