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) {

this.validateForm.controls[i].clearValidators();