How do I implement validators in Angular?

How do I implement validators in Angular?

To implement validators in Angular, you can use the built-in validators from @angular/forms. You can apply them to form controls in your reactive forms or template-driven forms.

Can you show me an example of using required and minlength validators?

Sure! In a reactive form, you can do it like this:

import { FormBuilder, Validators } from '@angular/forms';

this.form = this.fb.group({
  name: ['', [Validators.required, Validators.minLength(3)]],
});

This sets up a form control named 'name' that is required and must have at least 3 characters.

What if I want to create a custom validator?

You can create a custom validator by defining a function that returns either null (if valid) or an object (if invalid). Here's an example:

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

export function customValidator(control: AbstractControl): ValidationErrors | null {
  return control.value === 'invalid' ? { invalidValue: true } : null;
}

Then, you can use it like this:

this.form = this.fb.group({
  field: ['', customValidator],
});