Как получить своего рода эквивалент $ viewValue в Angular 2+? - PullRequest
Новая
       5

Как получить своего рода эквивалент $ viewValue в Angular 2+?

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

Я работаю с Angular 7 и Реактивными формами. У меня есть ввод даты (mat-datepicker), который требуется.

Проблема заключается в следующем: я хочу вывести более конкретное сообщение c, чтобы пользователь мог понять, почему ввод все еще требуется, когда он / она ввели неправильное значение.

Как вы, возможно, знаете, недопустимые модели дат преобразуются в нулевые значения, поэтому считается, что входные данные содержат требуемую ошибку (даже если пользователь видит значение в ней) без возможности различения guish пустое значение из недопустимого значения (так как оба заканчивают тем, что были нулем).

То, что я в настоящее время делаю:

  • Создан валидатор в форме dateFormat(input:ElementRef): ValidatorFn.
  • Используется @ViewChild('dateInputRef') dateInputRef: ElementRef; для прикрепления собственного элемента ввода к моему компоненту
  • Используется в моем компоненте следующим образом: myFormControl: ['', [dateFormat(this.dateInputRef), Validators.required]]

И это код моего валидатора : 

export function dateFormat(input: ElementRef): ValidatorFn {
    return (control: FormControl): ValidationErrors | null => {
        let error = null;
        const modelValue = control.value;
        const viewValue = input.nativeElement.value;
        if (!modelValue && viewValue) {
            // date is null but we have an input string
            if (!DATE_FORMATS.re.test(viewValue)) {
                // the input does not respect my format DD/MM/YYYY
                error = {dateFormat: true};
            } else if (!moment(viewValue, DATE_FORMATS.moment.ihm).isValid()) {
                // the input gives an Invalid Date
                error = {notAValidDate: true};
            }
        }
        return error;
    };
}

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

Заранее благодарим вас за чтение / потраченное время на это.

...