Untitled
unknown
plain_text
2 years ago
2.0 kB
10
Indexable
import { Component, Host, Input, Optional, SkipSelf } from '@angular/core'; import { ControlContainer, FormControl, NgForm } from '@angular/forms'; @Component({ selector: 'error-messages', templateUrl: './error-messages.component.html', styleUrls: ['./error-messages.component.scss'], }) export class ErrorMessagesComponent { @Input() fieldName!: string; @Input() set messages(value: Array<[string, string]>) { this.errorMessages = new Map([...value]); } private errorMessages: Map<string, string> | undefined; constructor( @Optional() @Host() @SkipSelf() private readonly container: ControlContainer, @Optional() private readonly form: NgForm ) {} /** * @ignore */ getErrorMessages() { const control = this.container?.control?.get(this.fieldName) as FormControl; const errorsArray: string[] = []; let errorMessage: string; const Errors = control.errors; this.errorMessages?.forEach((value: string) => { errorsArray.push(value); }); Object.keys(control.errors ?? {}).forEach((key) => { if (key === 'minlength') { errorMessage = `Please Enter Minimum ${Errors?.[key].requiredLength} Characters`; } else if (key === 'maxlength') { errorMessage = `Exceeded Maximum Limit of ${Errors?.[key].requiredLength} Characters`; } else if (key === 'pattern') { errorMessage = 'Incorrect Format'; } else if (key === 'email') { errorMessage = 'Invalid Email'; } else if (key === 'required') { errorMessage = 'This Field is Required'; } errorsArray.push(errorMessage); }); return this.shouldDisplayError(control) ? errorsArray : null; } private shouldDisplayError(control: FormControl) { if (control && control.errors) { return (this.form && this.form.submitted) || control.touched; } return false; } }
Editor is loading...