Угловой реактивный пользовательский валидатор не работает - PullRequest
Новая
       14

Угловой реактивный пользовательский валидатор не работает

0 голосов
/ 19 сентября 2018

Я написал простой валидатор, сравнивающий два элемента управления формой даты в группе форм.

Простая проверка: maturityDate должно быть> 100 * * valueDate , если не недействительнымгруппа форм.

Ниже приведено определение группы форм: 

this.datesForm = this._fb.group(
  {
    tradeDate: [new Date(), Validators.required],
    valueDate: [new Date(), Validators.required],
    maturityDate: [new Date(), [Validators.required]],
    dayCount: [{value: 0, disabled: true}, Validators.required]
  },
  {
    validator: validateMaturityDate
  }
);

А вот мой валидатор.ts 

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

export function validateMaturityDate(datesForm: AbstractControl) {
    const valueDate: Date = datesForm.get('valueDate').value;
    const maturityDate: Date = datesForm.get('maturityDate').value;

    if (maturityDate <= valueDate) {
        datesForm.setErrors({ 'validMaturity': true });
    } else {
        datesForm.setErrors({ 'validMaturity': false });
    }
    return;
}

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

https://i.stack.imgur.com/KzRJg.png https://i.stack.imgur.com/KEM1v.png

Ответы [ 2 ]

0 голосов
/ 30 ноября 2018

Ответ от malbarmawi точен.Этот вопрос был точно таким же сценарием, для которого я не мог заставить валидатор formGroup выполнять и вращать мои колеса часами.

Однако в моем случае я перечислил валидатор в FormGroup под ключом, называемым валидаторами вместо валидатора.

Это правильно: { валидатор : validateMaturityDate} Это нене выполняется: { validators : validateMaturityDate}

Документация angular.io здесь показывает валидаторы как множественное число.Так что либо я что-то упустил, либо документация может потребоваться настроить.

https://v6.angular.io/guide/form-validation#cross-field-validation

0 голосов
/ 19 сентября 2018

Обновите функцию validateMaturityDate, чтобы она возвращала объект, связанный с ошибкой или нулем 

export function validateMaturityDate(datesForm: AbstractControl)  {
    const valueDate: Date = datesForm.get('valueDate').value;
    const maturityDate: Date = datesForm.get('maturityDate').value;

    if (maturityDate <= valueDate) {
        return { 'validMaturity': true }; 
    } else {
        return null;
    }
}

Интерфейс ValidatorFn

...