在 Angular 中验证电话号码

Question

我正在尝试验证 Angular 应用程序中的电话号码。我有一个带有输入字段的表单。我正在尝试以下操作，但收到以下错误。

无效的正则表达式：/^(?:+?(61))？?(?:((?=.*)))?(0?[2-57-8]))？?(dd(?:- |(?!dd[- ]?d[- ]))dd[- ]?d[- ]?d{3})$/: 没有可重复的内容

超文本标记语言

<div class="input-container">
<label for="mobile">Cell number*</label>
<input id="mobile" type="text" formControlName="mobile" size="10" placeholder="000 000 000">
</div>
<p class="error"*ngIf="!userFormGroup.get('mobile').valid && userFormGroup.get('mobile').dirty">
   * Invalid mobile number.
</p>

TS

mobile: new FormControl(null, [Validators.required, Validators.pattern('^(?:\+?(61))? ?(?:\((?=.*\)))?(0?[2-57-8])\)? ?(\d\d(?:[- ](?=\d{3})|(?!\d\d[- ]?\d[- ]))\d\d[- ]?\d[- ]?\d{3})$')])

我基本上需要验证输入是否至少有 10 位数字、允许 + 字符、排除任何空格

Answer 1

尝试用这个条件userFormGroup.get(\'mobile\').hasError(\'pattern\')

\n\n

斯塔克闪电战

\n\n

正则表达式

\n\n

Validators.pattern(\'(([+][(]?[0-9]{1,3}[)]?)|([(]?[0-9]{4}[)]?))\\s*[)]?[-\\s\\.]?[(]?[0-9]{1,3}[)]?([-\\s\\.]?[0-9]{3})([-\\s\\.]?[0-9]{3,4})\')\n

\n\n

模板

\n\n

<p class="error" *ngIf="userFormGroup.get(\'mobile\').invalid && (userFormGroup.get(\'mobile\').dirty || userFormGroup.get(\'mobile\').touched)">\n    <ng-container\xc2\xa0*ngIf="userFormGroup.get(\'mobile\').hasError(\'required\')">\n        mobile is Required!\n    </ng-container>\n    <ng-container *ngIf="userFormGroup.get(\'mobile\').hasError(\'pattern\')">\n        * Invalid mobile number.\n    </ng-container>\n</p>\n

\n