Date picker in angular

Question

Using angular datepicker, I cannot seem to get the selected date from the datepicker. When I select a date in the calendar it always sends the current date to the backend. Not the selected date.

This is the method that I implemented in TypeScript file.

getAttendanceForPeriod(startDate: Date, endDate: Date) {
    this.apiService
      .getAttendanceForPeriod(startDate, endDate)
      .subscribe((result) => {
        this.dataSource = result.payload;
      });
  }

This is the method that I implemented in service file.

public getAttendanceForPeriod(startDate: Date, endDate: Date) {
    return this.http.post<any>(
      '/attendance/get-attendance-for-period',
      {
        params: {
          startDate: startDate.toISOString(),
          endDate: endDate.toISOString(),
        },
      }
    );
  }

How can I get the correct date from the date picker?