Hi
I want that Dob should be greater than doj . and minimum difference between the two should be 1 year.
ON below line i am getting error - Property 'dob' does not exist on type 'EmpAddEditComponent'
<input matInput [matDatepicker]="picker" [appDateCompare]="dob" formControlName="doj">
<form [formGroup]="empForm" ngSubmit="Save()">
<div mat-dialog-content class="content">
<div class="row">
<mat-form-field>
<mat-label>Choose a date</mat-label>
<input matInput [matDatepicker]="picker" formControlName="dob">
<mat-hint>MM/DD/YYYY</mat-hint>
<mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
<mat-form-field>
<mat-label>Choose a date</mat-label>
<input matInput [matDatepicker]="picker" [appDateCompare]="dob" formControlName="doj">
<mat-hint>MM/DD/YYYY</mat-hint>
<mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
</div>
</div>
<div mat-dialog-actions class="action">
<button mat-raised-button color="warning">Cancel</button>
<button mat-raised-button color="primary" (click)="OnSave()">Save</button>
</div>
</form>
---------------TYPESCRIPT
export class EmpAddEditComponent implements OnInit {
empForm : FormGroup;
constructor(private _fb : FormBuilder){
this.empForm = this._fb.group({
dob:'',
doj:'',
})
}
}
*************** DIRECTIVE
import { Directive, Input, forwardRef } from '@angular/core';
import { NG_VALIDATORS, Validator, AbstractControl, ValidationErrors } from '@angular/forms';
@Directive({
selector: '[appDateRangeValidator]',
standalone: true,
providers: [{ provide: NG_VALIDATORS, useExisting: DateRangeValidatorDirective, multi: true }]
})
export class DateRangeValidatorDirective implements Validator {
@Input('appDateCompare') compareDate: Date;
validate(control: AbstractControl): ValidationErrors | null {
const currentDate = new Date(control.value);
if (this.compareDate && currentDate) {
if (currentDate < this.compareDate) {
return { 'dateCompare': true }; // Validation failed
}
}
return null; // Validation passed
}
}