angular 文本框只能避免 1 个特殊字符

Question

美好的一天，

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

<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"，这样就不会提示错误信息，可以通过。我想知道我没有在模式中包含 ~，但不确定为什么它仍然可以通过。

请问我做错了什么？

Answer 1

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

您可能想试试这个

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

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

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

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

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

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

angular 文本框只能避免 1 个特殊字符

angular text box avoid only 1 special character

regex

special-characters

angular