Описание валидации в валидаторах форм angular2

Просматривая класс управления API angular2, я вижу

minLength(minLength: number) : Function

Я понимаю, что делает функция.

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

Например, мне интересно, не может ли функция быть

minLength(minLength: number, description: string) : Function

Где описание описывает причину ошибки, как показано ниже

Control firstCtrl = new Control( '', Validators.minLength(2, description: 'Minium of two characters required) );

Мне не удалось найти аналогичные валидаторы в API. Если таковой существует, я был бы рад, если бы можно было поделиться ссылкой/объяснением.

С нетерпением ждем ваших отзывов.


angular angular2-forms
person st_clair_clarke    schedule 29.01.2016    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Нет встроенных средств проверки. которые принимают дополнительный параметр для описания ошибки. Но для этого вы можете написать свой собственный.

Возьмем, к примеру, встроенный валидатор minLength. Мы добавляем второй параметр с именем desc, который будет содержать пользовательское сообщение об ошибке.

class CustomValidators {
  static minLengthWithDescription(minLength: number, desc: string): Function {
    return (control: modelModule.Control): {[key: string]: any} => {
      return v.length < minLength ?
        {"minlength": {
             "requiredLength": minLength, 
             "actualLength": v.length, 
             "desc": desc // Here we pass our custom error message
        }
      } : null;
    };
  }
}

Как видите, мы едва коснулись оригинала. Теперь это так же просто, как проверить в нашем представлении, существует ли сообщение об ошибке.

<form [ngFormModel]="myForm">
  <p>
    Year: <input ngControl="year"> 

    // We use the Elvis operator to check if the error exists or not
    // if exists it will print the error message
    {{myForm.controls.year.getError('minlength')?.desc}}
  </p>
</form>

И, наконец, мы устанавливаем сообщение об ошибке, которое мы хотим показать

export class App {
    year: Control = new Control('', 
        CustomValidators.minLengthWithDescription(4, 'Wrong ammount of numbers'));
}

Вот plnkr с примером работы.

person Eric Martinez    schedule 29.01.2016
comment
Спасибо, Эрик. Я думаю, вы должны представить свое решение как проблему. Конечно, просто добавление описания в качестве сообщения об ошибке лучше, чем то, что существует сейчас. - person st_clair_clarke; 29.01.2016
comment
Откуда modelModule.Control. Я использую Dart, поэтому пытаюсь перенести валидатор на Dart. Я не могу найти ссылку на modelModule в примере или в демонстрации plnkr. - person st_clair_clarke; 31.01.2016
comment
отсутствует строка var v: string = control.value; (из вашего плунжера). - person Yahya KACEM; 18.04.2016