Custom validators in Angular - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a custom validator in Angular?

A custom validator is a function you write to check if a form control's value meets specific rules beyond built-in checks. It helps you create your own validation logic.

beginner

How do you apply a custom validator to a form control in Angular?

You add the custom validator function to the control's validators array when creating the form control, usually inside FormBuilder or FormControl constructor.

beginner

What should a custom validator function return if the control value is valid?

It should return null to indicate the value passed the validation.

beginner

What does a custom validator return if the control value is invalid?

It returns an object with a key describing the error and a value with details, for example: { 'myError': true }.

beginner

Why use custom validators instead of built-in validators?

Because sometimes your form needs special rules that Angular's built-in validators don't cover, like checking a username format or matching passwords.

What does a custom validator function receive as input?

A A FormControl object

B A string value

C An event object

D A boolean flag

A custom validator function receives the FormControl object to access its current value and state.

What should a custom validator return if the control value is valid?

A false

B true

C {}

D null

Returning null means the control passed validation with no errors.

How do you add a custom validator to a FormControl?

A Call it inside ngOnInit

B Add it to the component's providers

C Pass it as the second argument in FormControl constructor

D Use it in the template only

You add custom validators as the second argument (or inside an array) when creating the FormControl.

What is the purpose of the error object returned by a custom validator?

A To describe what validation failed

B To reset the form

C To submit the form

D To style the input

The error object tells Angular which validation rule failed and can be used to show messages.

Which Angular module provides the tools to create reactive forms with custom validators?

A FormsModule

B ReactiveFormsModule

C BrowserModule

D HttpClientModule

ReactiveFormsModule is needed to build reactive forms and use custom validators.

Explain how to create and use a custom validator in Angular reactive forms.

Think about the function signature and how Angular expects validators.

Describe why and when you would create a custom validator instead of using built-in validators.

Consider cases where built-in validators are not enough.