custom validators angular 8 code example

Example 1: how to add validator to formgroup

this.myForm = this.formBuilder.group({
        myControl1: this.defaultValue,
        myControl2: this.defaultValue
      });
      debugger
      this.myForm.setValidators(this.comparisonValidator())
}

 public comparisonValidator() : ValidatorFn{
       return (group: FormGroup): ValidationErrors => {
          const control1 = group.controls['myControl1'];
          const control2 = group.controls['myControl2'];
          if (control1.value !== control2.value) {
             control2.setErrors({notEquivalent: true});
          } else {
             control2.setErrors(null);
          }
          return;
    };

Example 2: custom validator

import {AbstractControl, ValidatorFn} from '@angular/forms';

export function blue(): ValidatorFn {  
    return (control: AbstractControl): { [key: string]: any } | null =>  
        control.value?.toLowerCase() === 'blue' 
            ? null : {wrongColor: control.value};
}
<>

Example 3: angular9+how+to+add+validators

this.form.controls["firstName"].setValidators([Validators.minLength(1), Validators.maxLength(30)]);

Example 4: angular number validation

ng-pattern="re"

Tags:

Misc Example