Angular6-表单校验-脏校验

import {Component, OnInit} from '@angular/core';
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import {encryptedDES} from '../../tools/nb-fn.utils';
import {NbMessageService} from '../../services/message/nb-message-service';

@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
validateForm: FormGroup;

constructor(private fb: FormBuilder,
private msg: NbMessageService) {
}

ngOnInit() {
this.validateForm = this.fb.group({
username: [null, [Validators.required]],
password: [null, [Validators.required]],
remember: [true]
});
}

login() {
if (!this.validateForm.valid) {
this.msg.showErrorMessage('请完善信息');
this.openDirtyControl(this.validateForm);
return;
}
}

// 打开脏检验
openDirtyControl(data) {
for (const i in data.controls) {
this.validateForm.controls[i].markAsDirty();
this.validateForm.controls[i].updateValueAndValidity();
}
}

// 关闭脏校验
closeDirtyControl(data) {
for (const i in data.controls) {
this.validateForm.controls[i].clearValidators();
this.validateForm.controls[i].updateValueAndValidity();
}
}