Validators — Angular | Spec-Zone.ru

Предоставляет набор встроенных валидаторов, которые можно использовать для элементов управления формы.

API

class Validators {
  static min(min: number): ValidatorFn;
  static max(max: number): ValidatorFn;
  static required(control: AbstractControl<any, any, any>): ValidationErrors | null;
  static requiredTrue(control: AbstractControl<any, any, any>): ValidationErrors | null;
  static email(control: AbstractControl<any, any, any>): ValidationErrors | null;
  static minLength(minLength: number): ValidatorFn;
  static maxLength(maxLength: number): ValidatorFn;
  static pattern(pattern: string | RegExp): ValidatorFn;
  static nullValidator(control: AbstractControl<any, any, any>): ValidationErrors | null;
  static compose(validators: null): null;
  static compose(validators: (ValidatorFn | null | undefined)[]): ValidatorFn | null;
  static composeAsync(validators: (AsyncValidatorFn | null)[]): AsyncValidatorFn | null;
}

min

ValidatorFn

Валидатор, который требует, чтобы значение элемента управления было больше или равно заданному числу.

@paramminnumber

@returnsValidatorFn

Функция-валидатор, которая возвращает карту ошибок со свойством min, если проверка не пройдена, и null в противном случае.

Примечания по использованию

Проверка на минимальное значение 3

const control = new FormControl(2, Validators.min(3));

console.log(control.errors); // {min: {min: 3, actual: 2}}

max

ValidatorFn

Валидатор, который требует, чтобы значение элемента управления было меньше или равно заданному числу.

@parammaxnumber

@returnsValidatorFn

Функция-валидатор, которая возвращает карту ошибок со свойством max, если проверка не пройдена, и null в противном случае.

Примечания по использованию

Проверка на максимальное значение 15

const control = new FormControl(16, Validators.max(15));

console.log(control.errors); // {max: {max: 15, actual: 16}}

required

ValidationErrors | null

Валидатор, который требует, чтобы значение элемента управления не было пустым.

@paramcontrolAbstractControl<any, any, any>

@returnsValidationErrors | null

Карта ошибок со свойством required, если проверка не пройдена, и null в противном случае.

Примечания по использованию

Проверка того, что поле не пустое

const control = new FormControl('', Validators.required);

console.log(control.errors); // {required: true}

requiredTrue

ValidationErrors | null

Валидатор, который требует, чтобы значение элемента управления было равно true. Этот валидатор часто используется для обязательных флажков.

@paramcontrolAbstractControl<any, any, any>

@returnsValidationErrors | null

Карта ошибок, содержащая свойство required со значением true, если проверка не пройдена, и null в противном случае.

Примечания по использованию

Проверка того, что значение поля равно true

const control = new FormControl('some value', Validators.requiredTrue);

console.log(control.errors); // {required: true}

email

ValidationErrors | null

Валидатор, который требует, чтобы значение элемента управления прошло проверку адреса электронной почты.

Проверяет значение с помощью шаблона регулярного выражения, подходящего для распространённых случаев использования. Шаблон основан на определении действительного адреса электронной почты из спецификации WHATWG HTML и дополнен некоторыми правилами RFC (например, правилами для доменных имён и длины различных частей адреса).

Отличия от версии WHATWG:

Запрещено, чтобы local-part (часть перед символом @) начиналась или заканчивалась точкой (.).
Запрещено, чтобы длина local-part превышала 64 символа.
Запрещено, чтобы длина всего адреса превышала 254 символа.

Если этот шаблон не подходит для ваших бизнес-требований, можно использовать Validators.pattern(), чтобы проверить значение по другому шаблону.

@paramcontrolAbstractControl<any, any, any>

@returnsValidationErrors | null

Карта ошибок со свойством email, если проверка не пройдена, и null в противном случае.

Примечания по использованию

Проверка соответствия поля допустимому шаблону адреса электронной почты

const control = new FormControl('bad@', Validators.email);

console.log(control.errors); // {email: true}

minLength

ValidatorFn

Валидатор, который требует, чтобы количество элементов в значении элемента управления было больше или равно заданной минимальной длине. Этот валидатор также предоставляется по умолчанию при использовании атрибута HTML5 minlength. Обратите внимание, что валидатор minLength предназначен только для типов с числовым свойством length или size, например строк, массивов или множеств. Логика валидатора minLength также не выполняется для значений, у которых свойство length или size равно 0 (например, для пустой строки или пустого массива), чтобы поддерживать необязательные элементы управления. Если пустые значения не должны считаться допустимыми, можно использовать стандартный валидатор required.

@paramminLengthnumber

@returnsValidatorFn

Функция-валидатор, которая возвращает карту ошибок со свойством minlength, если проверка не пройдена, и null в противном случае.

Примечания по использованию

Проверка того, что поле содержит не менее 3 символов

const control = new FormControl('ng', Validators.minLength(3));

console.log(control.errors); // {minlength: {requiredLength: 3, actualLength: 2}}

<input minlength="5">

maxLength

ValidatorFn

Валидатор, который требует, чтобы количество элементов в значении элемента управления было меньше или равно заданной максимальной длине. Этот валидатор также предоставляется по умолчанию при использовании атрибута HTML5 maxlength. Обратите внимание, что валидатор maxLength предназначен только для типов с числовым свойством length или size, например строк, массивов или множеств.

@parammaxLengthnumber

@returnsValidatorFn

Функция-валидатор, которая возвращает карту ошибок со свойством maxlength, если проверка не пройдена, и null в противном случае.

Примечания по использованию

Проверка того, что поле содержит не более 5 символов

const control = new FormControl('Angular', Validators.maxLength(5));

console.log(control.errors); // {maxlength: {requiredLength: 5, actualLength: 7}}

<input maxlength="5">

pattern

ValidatorFn

Валидатор, который требует, чтобы значение элемента управления соответствовало шаблону регулярного выражения. Этот валидатор также предоставляется по умолчанию при использовании атрибута HTML5 pattern.

@parampatternstring | RegExp

Регулярное выражение, которое используется без изменений для проверки значений, или строка. Если передана строка, к ней добавляется символ ^ в начале и символ $ в конце (если их ещё нет), а полученное регулярное выражение используется для проверки значений.

@returnsValidatorFn

Функция-валидатор, которая возвращает карту ошибок со свойством pattern, если проверка не пройдена, и null в противном случае.

Примечания по использованию

Проверка того, что поле содержит только буквы или пробелы

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 ]*">

Сопоставление с шаблоном при глобальном или sticky-флаге

RegExp-объекты, созданные с флагами g или y и переданные в Validators.pattern, могут давать разные результаты для одного и того же ввода при последовательном запуске проверок. Это связано с тем, как поведение RegExp.prototype.test определено в ECMA-262 (RegExp сохраняет индекс последнего совпадения при использовании глобального или sticky-флага). Учитывая это поведение, при использовании Validators.pattern рекомендуется не передавать объект RegExp с включённым глобальным или sticky-флагом.

// Not recommended (since the `g` flag is used)
const controlOne = new FormControl('1', Validators.pattern(/foo/g));

// Good
const controlTwo = new FormControl('1', Validators.pattern(/foo/));

nullValidator

ValidationErrors | null

Валидатор, который ничего не выполняет.

@paramcontrolAbstractControl<any, any, any>

@returnsValidationErrors | null

compose

2 перегрузки

Объединяет несколько валидаторов в одну функцию, которая возвращает объединение отдельных карт ошибок для указанного элемента управления.

@paramvalidatorsnull

@returnsnull

Функция-валидатор, которая возвращает карту ошибок с объединёнными картами ошибок валидаторов, если проверка не пройдена, и null в противном случае.

@paramvalidators(ValidatorFn | null | undefined)[]

@returnsValidatorFn | null

composeAsync

AsyncValidatorFn | null

Объединяет несколько асинхронных валидаторов в одну функцию, которая возвращает объединение отдельных объектов ошибок для указанного элемента управления.

@paramvalidators(AsyncValidatorFn | null)[]

@returnsAsyncValidatorFn | null

Функция-валидатор, которая возвращает карту ошибок с объединёнными объектами ошибок асинхронных валидаторов, если проверка не пройдена, и null в противном случае.

Описание

Предоставляет набор встроенных валидаторов, которые можно использовать для элементов управления формы.

Валидатор — это функция, которая обрабатывает FormControl или набор элементов управления и возвращает карту ошибок либо null. Карта со значением null означает, что проверка пройдена.

Валидаторы

API

Проверка на минимальное значение 3

Проверка на максимальное значение 15

Проверка того, что поле не пустое

Проверка того, что значение поля равно true

Проверка соответствия поля допустимому шаблону адреса электронной почты

Проверка того, что поле содержит не менее 3 символов

Проверка того, что поле содержит не более 5 символов

Проверка того, что поле содержит только буквы или пробелы

Сопоставление с шаблоном при глобальном или sticky-флаге

Описание