Validators
class
Provides a set of built-in validators that can be used by form controls.
class Validators {
static min(min: number): ValidatorFn
static max(max: number): ValidatorFn
static required(control: AbstractControl): ValidationErrors | null
static requiredTrue(control: AbstractControl): ValidationErrors | null
static email(control: AbstractControl): ValidationErrors | null
static minLength(minLength: number): ValidatorFn
static maxLength(maxLength: number): ValidatorFn
static pattern(pattern: string | RegExp): ValidatorFn
static nullValidator(control: AbstractControl): ValidationErrors | null
static compose(validators: ValidatorFn[]): ValidatorFn | null
static composeAsync(validators: AsyncValidatorFn[]): AsyncValidatorFn | null
} See also
Description
A validator is a function that processes a FormControl or collection of controls and returns an error map or null. A null map means that validation has passed.
Static methods
| min() | |||
|---|---|---|---|
| Validator that requires the control's value to be greater than or equal to the provided number. The validator exists only as a function and not as a directive. | |||
|
min | number |
Returns
ValidatorFn: A validator function that returns an error map with the min property if the validation check fails, otherwise null.
Usage Notes
Validate against a minimum of 3
const control = new FormControl(2, Validators.min(3));
console.log(control.errors); // {min: {min: 3, actual: 2}} | max() | |||
|---|---|---|---|
| Validator that requires the control's value to be less than or equal to the provided number. The validator exists only as a function and not as a directive. | |||
|
max | number |
Returns
ValidatorFn: A validator function that returns an error map with the max property if the validation check fails, otherwise null.
Usage Notes
Validate against a maximum of 15
const control = new FormControl(16, Validators.max(15));
console.log(control.errors); // {max: {max: 15, actual: 16}} | required() | |||
|---|---|---|---|
| Validator that requires the control have a non-empty value. | |||
|
control | AbstractControl |
Returns
ValidationErrors | null: An error map with the required property if the validation check fails, otherwise null.
Usage Notes
Validate that the field is non-empty
const control = new FormControl('', Validators.required);
console.log(control.errors); // {required: true} | requiredTrue() | |||
|---|---|---|---|
| Validator that requires the control's value be true. This validator is commonly used for required checkboxes. | |||
|
control | AbstractControl |
Returns
ValidationErrors | null: An error map that contains the required property set to true if the validation check fails, otherwise null.
Usage Notes
Validate that the field value is true
const control = new FormControl('', Validators.requiredTrue);
console.log(control.errors); // {required: true} | email() | |||
|---|---|---|---|
| Validator that requires the control's value pass an email validation test. | |||
|
control | AbstractControl |
Returns
ValidationErrors | null: An error map with the email property if the validation check fails, otherwise null.
Usage Notes
Validate that the field matches a valid email pattern
const control = new FormControl('bad@', Validators.email);
console.log(control.errors); // {email: true} | minLength() | |||
|---|---|---|---|
| Validator that requires the length of the control's value to be greater than or equal to the provided minimum length. This validator is also provided by default if you use the the HTML5 | |||
|
minLength | number |
Returns
ValidatorFn: A validator function that returns an error map with the minlength if the validation check fails, otherwise null.
Usage Notes
Validate that the field has a minimum of 3 characters
const control = new FormControl('ng', Validators.minLength(3));
console.log(control.errors); // {minlength: {requiredLength: 3, actualLength: 2}} <input minlength="5">
| maxLength() | |||
|---|---|---|---|
| Validator that requires the length of the control's value to be less than or equal to the provided maximum length. This validator is also provided by default if you use the the HTML5 | |||
|
maxLength | number |
Returns
ValidatorFn: A validator function that returns an error map with the maxlength property if the validation check fails, otherwise null.
Usage Notes
Validate that the field has maximum of 5 characters
const control = new FormControl('Angular', Validators.maxLength(5));
console.log(control.errors); // {maxlength: {requiredLength: 5, actualLength: 7}} <input maxlength="5">
| pattern() | |||
|---|---|---|---|
| Validator that requires the control's value to match a regex pattern. This validator is also provided by default if you use the HTML5 | |||
|
pattern | string | RegExp |
Returns
ValidatorFn: A validator function that returns an error map with the pattern property if the validation check fails, otherwise null.
Note that if a Regexp is provided, the Regexp is used as is to test the values. On the other hand, if a string is passed, the ^ character is prepended and the $ character is appended to the provided string (if not already present), and the resulting regular expression is used to test the values.
Usage Notes
Validate that the field only contains letters or spaces
const control = new FormControl('1', Validators.pattern('[a-zA-Z ]*'));
console.log(control.errors); // {pattern: {requiredPattern: '^[a-zA-Z ]*$', actualValue: '1'}} <input pattern="[a-zA-Z ]*">
| nullValidator() | |||
|---|---|---|---|
| Validator that performs no operation. | |||
|
control | AbstractControl |
Returns
ValidationErrors | null
| compose() | |||
|---|---|---|---|
| Compose multiple validators into a single function that returns the union of the individual error maps for the provided control.
|
validators | null |
Returns
null: A validator function that returns an error map with the merged error maps of the validators if the validation check fails, otherwise null.
static compose(validators: ValidatorFn[]): ValidatorFn | null
Parameters
validators | ValidatorFn[] |
Returns
ValidatorFn | null
| composeAsync() | |||
|---|---|---|---|
| Compose multiple async validators into a single function that returns the union of the individual error objects for the provided control. | |||
|
validators | AsyncValidatorFn[] |
Returns
AsyncValidatorFn | null: A validator function that returns an error map with the merged error objects of the async validators if the validation check fails, otherwise null.
© 2010–2019 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v7.angular.io/api/forms/Validators