英文:
Problem getting Form to be valid after validation Function is called
问题
以下是翻译好的部分：
我在密码验证字段方面遇到了问题。在我的表单中，我有3个字段，一个是旧密码，另一个是新密码，还有确认新密码。如果用户输入新密码并确认密码，一切都正常，表单将变为有效并且可以提交。但是如果字段不匹配，而他编辑确认密码，它将变为有效。但是如果他在新密码上进行编辑，它将不会变为有效。
以下是检查这两个字段的函数，我看到它在我更改密码字段之一时被触发，但只有在最后更改确认密码时才会使表单有效。
static passwordMatchValidator(control: AbstractControl) {
const password: string = control.get('newPassword').value; // 从密码表单控件获取密码
const confirmPassword: string = control.get('confirmPassword').value; // 从确认密码表单控件获取密码
// 比较密码是否匹配
if (password !== confirmPassword) {
// 如果它们不匹配，将在确认密码表单控件中设置一个错误
console.log('不匹配' + password + ' - ' + confirmPassword)
control.get('confirmPassword').setErrors({ NoPassswordMatch: true });
}
}
请注意，此翻译仅包括代码部分，不包括问题中的其他内容。
英文:
I am having a problem with a password validation field. In my form i have 3 fields, one is the old password and the other is new password as well as confirm the new password. All works fine so far if the user enters the new password and confirms the password the form will become valid and he can submit. Now if the fields dont match and he edits the confirm password it will be valid. But if he makes the edit on the new password it will not.
Below is the function which checks the 2 fields and i see it get firered when i change either password field but it only makes the form valid when the change was made last on the confirm.
static passwordMatchValidator(control: AbstractControl) {
const password: string = control.get('newPassword').value; // get password from our password form control
const confirmPassword: string = control.get('confirmPassword').value; // get password from our confirmPassword form control
// compare is the password math
if (password !== confirmPassword) {
// if they don't match, set an error in our confirmPassword form control
console.log('No mathch' + password + ' - ' + confirmPassword)
control.get('confirmPassword').setErrors({ NoPassswordMatch: true });
}
// else {
// control.get('confirmPassword').setErrors({ NoPassswordMatch: false});
// }
}
Here is also a stackblitz sample which demonstrates this issue. Please ignore the layout as i didn't want to spen to much time on making it look same as in my app
答案1
得分: 2
你可以按如下方式重置错误：
control.get('confirmPassword').setErrors(null);
英文:
You can reset the errors as follows:
control.get('confirmPassword').setErrors(null);
答案2
得分: 0
你可以简单地返回一个对象（解释错误），如果密码不匹配。
static passwordMatchValidator(control: AbstractControl) {
const password: string = control.get('newPassword').value; // 从密码表单控制中获取密码
const confirmPassword: string = control.get('confirmPassword').value; // 从确认密码表单控制中获取密码
// 比较密码是否匹配
if (password !== confirmPassword) {
return { matchError: '密码不匹配' };
}
}
英文:
You can simply return an object(explaining the error) if passwords do not match
static passwordMatchValidator(control: AbstractControl) {
const password: string = control.get('newPassword').value; // get password from our password form control
const confirmPassword: string = control.get('confirmPassword').value; // get password from our confirmPassword form control
// compare is the password math
if (password !== confirmPassword) {
return {matchError: 'Passwords do not match'}
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论