HTML5 Angular2表单 - 如何删除默认工具提示消息"请输入有效格式"并显示友好的消息

时间:2018-02-14 22:53:40

标签: html5 angular angular2-routing

我正在使用Angular2表单。大多数都是使用html模式验证的,有些是经过表单验证的。对于html验证,我正在获取通用工具提示"请输入有效格式"对于电话不说格式。如何将其更改为"请输入10个数值。"

HTML代码

   <div class="row form-group">
             <div class="col-xs-12">
                <div class="float-label active">
                      <input type="text" class="input-underline-blue" id="phone" formControlName="phone"
                       placeholder="(123) 345-2222"
                        (keydown)="numOnlyDown($event)"
                         (keyup)="numOnlyUp($event)"
                             (blur)="phoneUSFormat($event)"
                            [maxlength]="14"
                         pattern="(?:\([1-9]\d{2}\)|\d{3})[- ]?\d{3}[- ]?\d{4}"               
                         required />
     <label for="phone">@Html.Sitecore().Field("Phone Label", profileItem)</label>
    <div *ngIf="!editInfoForm.get('phone').valid" class="alert alert-danger alert-small">
     <span *ngIf="editInfoForm.get('phone').hasError('required')">
                                                        @Html.Sitecore().Field("Phone Required", profileItem)
      </span>
      <span *ngIf="!editInfoForm.get('phone').hasError('required') && !editInfoForm.get('phone').valid">
      Enter a valid phone number.
         </span>
         </div>
   </div>
      </div>
   </div>

1 个答案:

答案 0 :(得分:0)

您可以在表单标记中使用novalidate属性来禁用默认验证。

...