I have an object in which I receive a range of hours, that range of hours in the frontend must be filtered based on a place and based on days.

This is the object:

Schedules: {
0:
days: {
0: "MO"
1: "TU"
2: "WE"
3: "TH"
4: "FR"
length: 5}
finalTimeStr: "05:00 pm"
initialTimeStr: "01:00 pm"
_id: "600b073094a6a36dc548dd79"}

It works something like this: The user chooses a place where he wants to make his appointment, then depending on the place a range of hours will be filtered from 1:00 pm to 5:00 pm and if he changes places, it will be filtered in the schedule from that place.

Another thing to take into account is that, for example, if the calendar of dates has to attend from Monday to Friday, on Monday the schedule would start from 6:00 am to 1:00 pm, but on Friday it would begin from 9:00 am at 5:00 pm.

How can I do it?

I have this method for filter the calender:

  dateFilter = (date: Date) => {
    // if (this.place.floor == null) {
    //   // return false;
    // }
    let currentDay = new Date;
    currentDay.setDate(currentDay.getDate() - 1)
    if (date < currentDay) {
      return false;
    }
    if (this.selectedPlace.schedules.some((schedule: any) => schedule.days.some((day: String) => {
      return day === DaysOfWeek[date.getDay()];
      // DaysOfWeek[( as number)] === DaysOfWeek[date.getDay()]
    }
    ))) {
      return true;

    }
    return false;
  }
  onClickNext() { 
   this.dataEntrante = this.place;
   // console.log('entrante', this.dataEntrante);
    this.serviceatClinic.disparadorHandClick.emit({data: this.dataEntrante})
    this.router.navigate(['../appointmentAtClinicHour'], { relativeTo: this._activedRoute }); 
  }

}

enum DaysOfWeek {
  "MO" = 1,
  "TU" = 2,
  "WE" = 3,
  "TH" = 4,
  "FR" = 5,
  "SA" = 6,
  "SU" = 7,
}