Question

在我的项目中进行一些更新后，输入模式不再起作用。看起来像更新到Ionic 2.1.18后输入模式似乎被破坏了：这部分之前适用于我，但现在密码。有效始终为假：

  <ion-item>
    <ion-label floating>Password*</ion-label>
    <ion-input type="password" required [(ngModel)]="regModel.Password" name="Password"
               #Password="ngModel" pattern="^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d*\w]{5,}$"
               (change)="checkPassword()"></ion-input>
  </ion-item>
  <ion-item no-border no-lines no-margin *ngIf="!Password.valid && Password.dirty" color="danger">
    <small>Five characters minimum,</small>
    <br>
    <small> at least 1 uppercase, 1 lowercase and 1 number {{Password.valid}} {{Password.dirty}}
    </small>
  </ion-item>

更新

有趣的是，一些简单的正则表达式工作得很好，但另一个 - 不要 - 例如， [a-zA-Z] * - 工作正常，\ d {5} - 不要

Answer 1

如果其他人碰巧遇到Ionic pattern的问题，以下是一个密码的工作示例：

至少包含一个数字
至少一个特殊字符
至少一个小写字符
至少一个大写字符

在.ts文件中：

export class SignUpPage {
  public PASSWORD_REGEX = `.*(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\\$%\\^&\\*]).*`

 // ...
}

在HTML内：

 <ion-input [(ngModel)]="signUpData.password"
            name="password"
            type="password"
            #password="ngModel"
            [minlength]="10"
            [pattern]="PASSWORD_REGEX"
            required>
 </ion-input>

注意：我在正则表达式中省略了密码长度检查并放在[minlength]属性中，因此可以轻松控制长度而无需深入研究正则表达式，但是，如果您希望以正则表达式方式实现，请使用这个： .*(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\$%\^&\*])(?=.{10,}) - 此处用户应提供至少10个字符的长密码。

Ionic / Angular2输入正则表达式模式被破坏

1 个答案: