我在控制台中已经成功,但它显示错误消息并在成功时显示提交按钮禁用。
请检查以下代码。
HTML代码
<div fxLayout="row" fxLayoutWrap="wrap">
<md-input-container class="ml-xs mr-xs" style="width: 60%">
<input mdInput placeholder="Email Address" maxlength="150" [ngModel]="CompanyEdit.varEmail" [formControl]="formCompany.controls['varEmail']">
</md-input-container>
<small *ngIf="formCompany.controls['varEmail'].hasError('required') && formCompany.controls['varEmail'].touched" class="mat-text-warn">Please insert email address.</small>
<small *ngIf="formCompany.controls['varEmail'].hasError('maxlength') && formCompany.controls['varEmail'].touched" class="mat-text-warn">Email address can not exceed 150 characters.</small>
<small *ngIf="formCompany.controls['varEmail'].hasError('email') && formCompany.controls['varEmail'].touched" class="mat-text-warn">Please enter valid email address.</small>
</div>
<div fxLayout="row" fxLayoutWrap="wrap">
<md-input-container class="ml-xs mr-xs" style="width: 60%">
<input mdInput placeholder="Personal Email Address" maxlength="150" [ngModel]="CompanyEdit.varPersonalEmail" [formControl]="formCompany.controls['varPersonalEmail']">
</md-input-container>
<small *ngIf="formCompany.controls['varPersonalEmail'].hasError('required') && formCompany.controls['varPersonalEmail'].touched" class="mat-text-warn">Please insert email address.</small>
<small *ngIf="formCompany.controls['varPersonalEmail'].hasError('maxlength') && formCompany.controls['varPersonalEmail'].touched" class="mat-text-warn">Email address can not exceed 150 characters.</small>
<small *ngIf="formCompany.controls['varPersonalEmail'].hasError('email') && formCompany.controls['varPersonalEmail'].touched" class="mat-text-warn">Please enter valid email address.</small>
<small *ngIf="formCompany.controls['varPersonalEmail'].hasError('MatchPersonalEmail') && formCompany.controls['varPersonalEmail'].touched" class="mat-text-warn">Please enter unique personal email address than Email.</small>
</div>
组件文件,我导入验证文件password-validation.ts
import { EmailValidation } from '../../validation/password-validation';
this.formCompany = this.fb.group({
varEmail: [null, Validators.compose([Validators.required, Validators.maxLength(150), CustomValidators.email])],
varPersonalEmail:[null,Validators.compose([Validators.required,Validators.maxLength(150),CustomValidators.email])],
}, {
validator: EmailValidation.MatchPersonalEmail// your validation method
});
Customvalidation.ts文件
import {AbstractControl} from '@angular/forms';
export class EmailValidation {
static MatchEmail(AC: AbstractControl) {
let password = AC.get('varEmail').value; // to get value in input tag
let confirmPassword = AC.get('varPersonalEmail').value; // to get value in input tag
if(password == confirmPassword) {
console.log('false');
AC.get('varEmail').setErrors( {MatchEmail: true} )
} else {
console.log('true');
return null
}
} }