45 lines
1.2 KiB
TypeScript
45 lines
1.2 KiB
TypeScript
|
import { Component, Input, OnInit } from '@angular/core';
|
||
|
import { FormGroup, ValidationErrors } from '@angular/forms';
|
||
|
|
||
|
@Component({
|
||
|
selector: 'app-errors-list',
|
||
|
templateUrl: './errors-list.component.html',
|
||
|
styleUrls: ['./errors-list.component.scss'],
|
||
|
})
|
||
|
export class ErrorsListComponent implements OnInit {
|
||
|
@Input() form: FormGroup;
|
||
|
public totalErrors = 0;
|
||
|
public messages = [];
|
||
|
|
||
|
ngOnInit() {
|
||
|
this.form.valueChanges.subscribe((data) => {
|
||
|
this.getFormValidationErrors();
|
||
|
});
|
||
|
}
|
||
|
|
||
|
getFormValidationErrors(): void {
|
||
|
// console.log('%c ==>> Validation Errors: ', 'color: red; font-weight: bold; font-size:25px;');
|
||
|
|
||
|
let totalErrors = 0;
|
||
|
this.messages = [];
|
||
|
|
||
|
Object.keys(this.form.controls).forEach((key) => {
|
||
|
const controlErrors: ValidationErrors = this.form.get(key).errors;
|
||
|
if (controlErrors != null) {
|
||
|
console.log('controlErrors', controlErrors);
|
||
|
totalErrors++;
|
||
|
Object.keys(controlErrors).forEach((keyError) => {
|
||
|
const message = '' + key + ', ' + keyError + '';
|
||
|
console.log(
|
||
|
'Key control: ' + key + ', keyError: ' + keyError + ', err value: ' + controlErrors[keyError]
|
||
|
);
|
||
|
this.messages.push(message);
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
this.totalErrors = totalErrors;
|
||
|
|
||
|
console.log('Number of errors: ', totalErrors);
|
||
|
}
|
||
|
}
|