首页 文章

提交Reactive表单时验证Untouched Required字段

提问于
浏览
0

我正在学习角4并且在反应形式上学习 . 我的要求是这样的 . 选择国家后,我有城市,选择城市后,我有银行,账号是单独的字段,所有情况都是强制性的 .

现在我无法禁用这样的提交按钮

<button [disabled]="!txnForm.valid  "type="submit" name="button">Submit</button>

enter image description here

因为我的表格会变得如此之大,因此在这里要添加近10-12个字段 . 现在,在提交按钮单击时,我想验证表单并将焦点集中到正确消息无效的字段 .

我已经为无效方案放置了支票但是为 *field which is untouched and required how will I place condition in the html for ngIF .

例如帐号是必需的,但没有触及此我点击继续然后我如何检查并向客户显示错误这是必填字段 .

注意:我已经尝试从ts文件中将prestine的值放在formControl上,但我想要一个HTML验证或最小的ts方法 .

1 回答

  • 0

    在你的html文件中:

    //onSubmit must be created in your ts file, ex: capture-international-payment.ts
    <form #txnForm="ngForm" [formGroup]="your_from_group" (ngSubmit)="onSubmit()> 
        //input fields...
        <input required
               type="text"
               id="account-number"
               formControlName="account_number">
        <button "type="submit" [disabled]="!txnForm.valid>Submit</button>
    </form>
    

相关问题