Angular 2表单验证模式正则表达式错误

杰西(Jesse Sliter)

我正在创建一个角度形式的表单,该表单要求名称字段仅包含字母数字字符和空格。为此,我使用pattern属性:

<input type="text" class="form-control" placeholder="Name" name="Name" [(ngModel)]="name" required pattern="/^[a-z\d-_\s]+$/i" #nameField="ngModel">

当字符串不匹配时,我想显示以下错误消息:

<div *ngIf="nameField.errors">
   <div [hidden]="!nameField.errors.pattern">
       <p class="has-error">
          Only spaces, letters, and numbers are allowed.
       </p>
   </div>
</div>

但是,似乎即使字符串应与正则表达式匹配,我仍然可以看到错误消息。有任何想法吗?

维克多·史翠比维

您可以使用

pattern="^[\w\s-]+$"

[A-Za-z\d_]相同的字符作为匹配\w在JavaScript原生正则表达式。因此,整个模式匹配一​​个或多个ASCII字母,数字,下划线,连字符或空格。

请注意,默认情况下,角形锚定模式,但是最好在模式中保留锚定^$显式,以使其与任何其他框架兼容。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

正则表达式模式验证Angularjs2

Angular 4:从对象调用正则表达式模式

Angular 4:未终止的正则表达式文字

Angular 4反应形式正则表达式电子邮件验证失败

难以在Angular 7中找到正确的正则表达式模式

Angular Reactive Forms模式验证:正则表达式无效

正则表达式在带有反应形式的Angular 2+管道中失败

angular指令中的无效正则表达式错误

Angular 6反应形式密码验证正则表达式模式和确认验证

Angular 6电子邮件正则表达式

Angular中带有密码模式的正则表达式问题

在反应形式上使用正则表达式进行Angular 7电子邮件验证

正则表达式匹配以使用angular的表达式开始和结束

Angular中的货币正则表达式

如何在Angular JS范围内给出正则表达式模式

Angular JS正则表达式替换

Angular源代码中的正则表达式

为什么Angular 2不接受此有效的正则表达式

当用户使用Angular中的正则表达式仅输入0或0.0时如何显示错误消息?

如何在不触发“检查表达式后更改表达式”的情况下在Angular 2上实现ngOnChanges以进行输入验证。错误

Ionic 2:表单验证器(正则表达式)

Angular2 管道正则表达式 url 检测

Angular2-6、正则表达式和输入装饰器

包含用于 formBuilder 的基于正则表达式的验证器会破坏 Angular 5.29 中的检查

JSON DATA 格式 angular 6 的正则表达式模式

带有 html 5 模式的 Angular 中的正则表达式荷兰邮政编码

使用 Angular 表单验证未正确验证特定的正则表达式

Angular 正则表达式指令

Angular FormControl 模式验证器不能使用正则表达式