【问题标题】:angular text box avoid only 1 special character角度文本框仅避免 1 个特殊字符
【发布时间】:2022-01-28 02:29:09
【问题描述】:

早安,

我有一个要求,即只需要不允许只有 1 个特殊字符用于用户输入,即~。以下是我的代码:

<div class="form-input ">
          <input class="pass" [type]="'password'" name="newPassword"
            placeholder="New Password" required pattern="^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#&()-/$=<>?]).*$" #newPassword="ngModel"
            [(ngModel)]="newPassword" (ngModelChange)="checkNewPassword()"
            (click)="onInputFocus()" minlength={{changePasswordFormCriteria.minPwrdLength}}
            maxlength=30 (blur)="checkNewOldPassVal()">
          </div>
        </div>

<div *ngIf="newPassword.errors?.pattern && loginPasswordForm.submitted" class="form-errors">
          New Password must consist at least one uppercase, one lowercase letter, one number and one special characters within this range ! @ # & ( ) - ? / $ = < >
        </div>

如您所见,我从pattern 中排除了~ 字符。如果我只键入 1 个特殊字符 ~,例如“password~abc”,这将有效,这将在 newPassword.errors?.pattern 中提示错误消息。这是正确的,符合要求。

但是,如果我包含其他特殊字符,例如我输入“password@~abc”,这不会提示错误信息,它会允许通过。我想知道我没有在模式中包含~,但不确定为什么它仍然可以通过。

我可以知道我犯了什么错误吗?

【问题讨论】:

  • 您过于关注 tilda 角色 ('~')。我怀疑您是否想要'μ''ع'。代替最后的.*$,您需要一个包含所有有效字符的字符类,该字符被执行一次或多次,后跟一个字符串结尾锚:[&lt;all valid characters go here&gt;]+$(或[...]*$[...]{4,}$,如所有有效字符串必须至少包含四个字符)。

标签: angular regex special-characters


【解决方案1】:

您使用的表达式仅确保字符串输入包含提供的表达式。它不会强制从输入中排除 ~。

你可能想试试这个

^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#&()\-/$=<>?])[a-zA-Z0-9!@#&()\-/$=<>?]+$

还有一件事,在你的正则表达式的这一部分

...[!@#&()-/$=?]...

您必须分隔连字符 (-),否则它将允许字符范围为 ascii 41-47。它应该看起来像这样

...[!@#&()\-/$=?]...

或者像@Cary 指出的那样简单地将连字符添加到开头或结尾。

【讨论】:

  • 抱歉,我错过了 1 个要求。是的,我需要确保输入包含表达式。同时,想排除~。我有什么办法可以做到这一点?要求与错误信息“新密码必须至少包含一个大写,一个小写字母,一个数字和一个特殊字符在此范围内!@#&()-?/$=”的要求相同,表示至少1特殊字符,除了 ~
  • 我的错,前面的例子没有按预期工作。更新后的应该按预期工作。
  • 太棒了。这是工作。谢谢你的帮助。我是 Angular 的新手,有时我发现我很难在 google 中找到这个东西,我的网站实际上有很多 angular 前端问题,我希望将来能继续向你学习。跨度>
  • 您可以将连字符放在字符类的开头或结尾而不转义。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-06-26
  • 2020-07-14
  • 2014-03-31
相关资源
最近更新 更多