我没有将交叉验证返回到模板驱动的表单

Question

当密码不同时，我正试图让true返回。

我的组件

this.restrict = new FormGroup({
email: new FormControl(this.user.email),
newPassword: new FormControl ('', [Validators.required, Validators.pattern('(?=\D*\d)(?=[^a-z]*[a-z])(?=[^A-Z]*[A-Z]).{6,30}')]),
confirmPassword: new FormControl(null, [Validators.required, Validators.minLength(6)]),
}, {validators: this.pwdMatchValidator});
get newPassword() { return this.restrict.get('newPassword');}
get confirmPassword() { return this.restrict.get('confirmPassword');}
pwdMatchValidator(frm: FormGroup) {
let pass = frm.get('newPassword').value;
let confirmPass = frm.get('confirmPassword').value;
console.log(pass);
console.log(confirmPass);
return pass === confirmPass ? null: { notSame: true};
}

在模板中我有

<p-password formControlName="confirmPassword"></p-password>
<small class="p-error" *ngIf="confirmPassword.hasError('required')">No puede estar vacio</small>
<small class="p-error" *ngIf="confirmPassword.hasError('minlength')">Debe ser de hasta 6 caracteres.</small>
<small class="p-error" *ngIf="confirmPassword.hasError('notSame', 'passwords')">Las contraseñan son diferentes.</small>
<button pButton pRipple label="Save" icon="pi pi-check" class="p-button-text" [disabled]="!restrict.valid"></button>

目前我得到的答案总是false

concole.log(pass);和console.log(confirmPass);工作，并且由于字段未验证，保存按钮仍被禁用，那么我如何获得notSame？我试过了：

{{ restrict.get('confirmPassword').errors?.notSame }}
{{ restrict.get('confirmPassword').errors }}
{{ confirmPassword.hasError('notSame') }}

在角度示例中，它们显示了在我的情况下(角度12(不起作用的形状

在Angular文档中，我找不到一个令人满意的关于如何处理退货的概念，你能解释一下吗？

Answer 1

您的验证器设置在FormGroup上，而不是confirmPassword表单控件上，因此您需要进行的检查实际上是在parentForm:上

<small ngIf="restrict.hasError('notSame')">...</small>

STACKBLITZ