ngx bootstrap - is there any possible way to create a date range validation with two different ngx date picker fields using angular 10?

Question

enter image description here

in the figure below, I want to prevent the user from selecting past date value in end date picker if he choose a start date

question from:https://stackoverflow.com/questions/65881110/is-there-any-possible-way-to-create-a-date-range-validation-with-two-different-n

Answer 1

You would need to write a custom validation method that accepts date controls. The start date would use end date as well start date to compare and validate accordingly. Something similar to

createForm() {
    this.form = this.fb.group({
      dateTo: ['', Validators.required ],
      dateFrom: ['', Validators.required ]
    }, {validator: this.dateLessThan('dateFrom', 'dateTo')});
  }

  dateLessThan(from: string, to: string) {
   return (group: FormGroup): {[key: string]: any} => {
    let f = group.controls[from];
    let t = group.controls[to];
    if (f.value > t.value) {
      return {
        dates: "Date from should be less than Date to"
      };
    }
    return {};
   }
 }