Angular Форма пользовательских валидаторов - PullRequest
Новая
       34

Angular Форма пользовательских валидаторов

1 голос
/ 17 февраля 2020

В настоящее время я использую Angular 8, и у меня проблема с пользовательским валидатором. Единственный валидатор, который работает - это Validators.minLength (3). noEmptyStringValidator не работает , хотя я могу вывести «здесь» в функцию валидатора. Не могли бы вы помочь мне?

Контекст следующий:

no-empty-string.validator.ts 

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

export function noEmptyStringValidator(control: AbstractControl): { [key: string]: any } | null {
    console.log('here');

    return control.value && control.value.trim().length > 0 ? { noEmptyString: { valid: true } } : null;
}

myComponent.component.ts 

...
topicLabelControl = new FormControl();
...
this.topicLabelControl.setValidators([ Validators.minLength(3), noEmptyStringValidator ]);
...
console.log(this.topicLabelControl.valid);

myComponent.component. html

<mat-form-field appearance="outline"
      (keydown.enter)="handleEnterKey()">
      <input type="text"
        matInput
        [formControl]="topicLabelControl"
        [matAutocomplete]="auto" />
      <mat-autocomplete #auto="matAutocomplete">...
      </mat-autocomplete>
    </mat-form-field>

1 Ответ

0 голосов
/ 17 февраля 2020

Ваш лог c кажется перевернутым: если вход действителен, валидатор должен вернуть null, если недействительным объект, ключ которого идентифицирует ошибку. (Значение может быть любым и может использоваться для сообщения любой дополнительной информации): 

return control.value && control.value.trim().length > 0 ? null : { noEmptyString: true };
...