angular表单登录验证

html:
<form [formGroup]="loginFormGroup">
<div class="div_f">
<div class="div_c_l"><span> 邮箱地址</span>
</div>
<div class="div_c_r"><ion-input type="text" style="97%; font-size: 0.18rem;"
clearInput="true"
formControlName="email">
</ion-input>
<div class="errorItem" *ngFor="let error of errorMessages.email">
<div class="error-message" *ngIf="loginFormGroup.controls.email.hasError(error.type)&& (loginFormGroup.controls.email.dirty || submitAttempt)">{{ error.message | translate}}</div>
</div>
</div>
<div style="clear:both"></div>
</div>

<div class="div_f">
<div class="div_c_l"><span>密码</span>
</div>
<div class="div_c_r"><ion-input type="password" style="97%;font-size: 0.18rem;" clearInput="true"
formControlName="password">
</ion-input>
<div class="errorItem" *ngFor="let error of errorMessages.password">
<div class="error-message" *ngIf="loginFormGroup.controls.password.hasError(error.type)&& (loginFormGroup.controls.password.dirty || submitAttempt)">{{ error.message | translate}}</div>
</div>
</div>
<div style="clear:both"></div>
</div>

<div class="div_f">
<div class="div_c_l"><span>验证码</span>
</div>
<div class="div_c_r">
<ion-input style="97%;font-size: 0.18rem; " clearInput="true"
formControlName="valicationCode"></ion-input>
<roy-countdown ></roy-countdown>
<div class="errorItem" *ngFor="let error of errorMessages.valicationCode">
<div class="error-message" *ngIf="loginFormGroup.controls.valicationCode.hasError(error.type)&& (loginFormGroup.controls.valicationCode.dirty || submitAttempt)">{{ error.message | translate}}</div>
</div>
</div>
<div style="clear:both"></div>
</div>
<button id="submit" class="btn_1" (click)="submit()">登录</button>
</form>

ts:
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { NavController } from '@ionic/angular';

export class CandidateLoginPage implements OnInit {
errorMessages: any = {
email: [
{ type: 'required', message: 'Name_Required' }
],
valicationCode: [
{ type: 'required', message: 'Name_Required' }
],
password: [
{ type: 'required', message: 'Name_Required' }
],
};
loginFormGroup: FormGroup;
constructor(private fb: FormBuilder,private navCtrl: NavController,) {
this.loginFormGroup = this.fb.group({
email: ['', Validators.required],
valicationCode: ['', Validators.required],
password: ['', Validators.required],
});
}
}