如何在角度中设置滑块范围日期

<mat-slider thumbLabel [min]="minDate.getTime()" [max]="maxDate.getTime()" [(ngModel)]="selectedDate"></mat-slider>
<mat-form-field>
  <input matInput [matDatepicker]="datepicker" [(ngModel)]="selectedDate" (ngModelChange)="onDateChange($event)">
  <mat-datepicker-toggle matSuffix [for]="datepicker"></mat-datepicker-toggle>
  <mat-datepicker #datepicker></mat-datepicker>
</mat-form-field>

import { Component } from '@angular/core';

@Component({
  selector: 'app-slider-date-range',
  templateUrl: './slider-date-range.component.html',
  styleUrls: ['./slider-date-range.component.css']
})
export class SliderDateRangeComponent {
  minDate: Date;
  maxDate: Date;
  selectedDate: Date;

  constructor() {
    this.minDate = new Date(2022, 0, 1); // 设置最小日期
    this.maxDate = new Date(2022, 11, 31); // 设置最大日期
    this.selectedDate = new Date(); // 设置默认选择日期为当前日期
  }

  onDateChange(event: any) {
    this.selectedDate = event;
  }
}

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MatSliderModule } from '@angular/material/slider';
import { MatInputModule } from '@angular/material/input';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatNativeDateModule } from '@angular/material/core';
import { SliderDateRangeComponent } from './slider-date-range.component';

@NgModule({
  declarations: [SliderDateRangeComponent],
  imports: [
    CommonModule,
    MatSliderModule,
    MatInputModule,
    MatDatepickerModule,
    MatNativeDateModule
  ],
  exports: [SliderDateRangeComponent]
})
export class SliderDateRangeModule { }