如何在 angular 2 中验证具有一个输入字段的表单？

Question

我有 one 输入字段，用户可以在其中输入 email 以及 10 digit phone number 如果满足此条件我想启用 continue 按钮。当用户键入 email 时，我可以 enable 按钮，但当用户键入 10 digit mobile number

时，我无法启用该按钮

这是我的代码 https://stackblitz.com/edit/angular-p5knn6?file=src%2Fapp%2Flogin-component%2Flogin-component.component.html

<div class="login_div">
  <form  #loginForm="ngForm">
    <input type="text" name="email"
           autocomplete="off"
           placeholder="Enter the Email or Number"
           [(ngModel)]="userenterValue"
           required
           pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$">
    <input type="submit" value="Continue"
           class="btn"
           [class.disbled]="!loginForm.valid"
           [disabled]="!loginForm.valid">
  </form>
</div>

Answer 1

只需使用这样的模式：

pattern="^(\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+)$|^(\d{10})$"

如何在 angular 2 中验证具有一个输入字段的表单？

how to validate form in angular 2 having one input field?

javascript

angular-validation

angular