У меня есть форма с 2 полями
1) Минимальное значение
2) Максимальное значение
Ниже моя форма:
constructor(public cdr:ChangeDetectorRef) {
this.feedbackForm = new FormGroup({
minScore: new FormControl('', [Validators.pattern(/^[0-9]+$/),Validators.required,Validators.minLength(1),Validators.maxLength(1)]),
maxScore: new FormControl('', [Validators.pattern(/^[0-9]+$/),Validators.required,Validators.minLength(1),Validators.maxLength(1)])
});
this.feedbackForm.setValidators(this.minMaxValidator());
}
Вот мой валидатор min max:
public minMaxValidator() : ValidatorFn{
return (group: FormGroup): ValidationErrors => {
const min = group.controls['minScore'];
const max = group.controls['maxScore'];
let changedValue;
if (min.value && max.value) {
if (this.prevMinVal && (this.prevMinVal === min.value)) {
changedValue = max;
} else {
changedValue = min;
}
this.prevMinVal = min.value;
if (min.value >= max.value) {
changedValue.setErrors({notEquivalent: true});
} else {
min.setErrors(null);
max.setErrors(null);
}
};
return;
}
};
Здесь, если я введу максимальное значение как '12t' с включенным текстом, то форма не будет отображать никаких ошибок из-за блока else min.setErrors (null); max.setErrors (null);
По мере того, как его вводят в блок else (который делает ошибки как null), шаблон в элементе управления формы обойден. Я хочу, чтобы все валидаторы (pattern и min max) были применяется сразу.