Struggling to incorporate a customized angular validator to check for date ranges.
The validator is functioning correctly and throwing a validation error. However, the issue lies in the fact that nothing is being displayed on the client side - there are no visible errors, and the form continues to be deemed valid. I've experimented with making various modifications to this code, but without any success.
Any suggestions on what steps to take next?
Html:
<div class="alert-danger" *ngIf="form.controls.creditCheckDate.errors?.dateRange">
Date should be from 1/1/2000 to Today.
</div>
.ts:
const controlsConfig = {
creditCheckDate: ['', [Validators.required,
CustomValidators.dateRange(new Date(2000, 1), new Date(Date.now()))]]
};
return this.fb.group(controlsConfig);
Validator:
static dateRange(minDate: Date | null, maxDate: Date | null): ValidatorFn {
return (c: AbstractControl): ValidationErrors | null => {
const validationError = { dateRange: true };
if (!c.value) {
return null;
}
const timestamp = Date.parse(c.value);
if (isNaN(timestamp)) {
return validationError;
}
const date = new Date(timestamp);
if ((minDate && minDate > date) || (maxDate && maxDate < date)) {
return validationError;
}
return null;
};
}