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

Question

我正在尝试使用 Angular 6 种反应式表单构建注册表单。

 ngOnInit() {
this.registerForm = this.formBuilder.group({
  firstName: ['', [Validators.required],
  lastName: ['', [Validators.required]],
  email: ['', [Validators.required, Validators.email]],
  password: ['', [Validators.required, Validators.pattern('^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&].{8,}$')]],
  confirmPassword: ['', [Validators.required, Validators.pattern('^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&].{8,}$')]]
});

}

我如何进行验证才能允许：

个数
首都
小写字母
任何特殊字符
最少8个字符

我正在使用的这个正则表达式工作正常，但我不能使用任何其他特殊字符，例如我试过 Demoo123# 但没有用。但是 Demoo123@ 工作正常。我假设我的正则表达式中的特殊字符部分存在问题。我是否必须手动提及所有允许的特殊字符？还是有某种捷径？我在某处读到正则表达式不喜欢主题标签 #...是真的吗？

另一个问题是如何进行确认验证，使 confirmPassword 值必须与密码字段值相同？

Answer 1

问题是我没有在密码字段中添加 pattern 属性。 <input pattern="^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&].{8,}$" >

这很连线。为什么在代码中指定的时候还要在input上指定呢？不知道，但它有效。

Answer 2

formGroup 中的 TypeScript 验证

password: ['', [
   Validators.required, 
   Validators.pattern("^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&].{8,}$")
]],

message: Password must contain more than 8 characters, 1 numeric, 1 upper case letter, and 1 special character($@$!%*?&).

Answer 3

传递 RegEx 作为参数对我有用：

Validators.pattern(new RegExp("^(?=.*[A-Z])(?=.*[!@#$%\^&\*])(?=.{9,}))")

或者我们可以在模式的两端使用正斜杠：

/your_pattern_here/

例如：

Validators.pattern(/^(?=.*[A-Z])(?=.*[!@#$%\^&\*])(?=.{9,}))/)

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

Angular 6 reactive form password validation regex pattern and confirmation validation

angular

angular6

angular-reactive-forms

angular-validation

angular-validator