Angular 日期选择器 setDate

Question

我有一个带有数据选择器的屏幕。 当我已经有一个数据参数时，它会在我的日历中选择我 2 个日期：日期参数加上当天的日期。 如果我有一个日期作为参数怎么办，以便它选择我作为日期作为参数而不是当天的日期

    <mat-label>Select a date</mat-label>
        <input matInput [matDatepicker]="picker"
        [(ngModel)]="myDate"
        (dateChange)="onChange($event)"
        placeholder="">
        <mat-datepicker #picker ></mat-datepicker>
        <mat-datepicker-toggle matSuffix [for]="picker" >

        </mat-datepicker-toggle>

Answer 1

这类似于这个问答： How to autofocus with highlight blue color on today date in datepicker of angular material?

Angular 材质将对今天的日期应用样式，这并不意味着选择了日期，它只是以某种方式出现，因为它的 CSS

您可以在组件的 CSS 中定位选定的今天节点，方法是添加它并将其更改为您需要的外观。

::ng-deep.mat-calendar-body-today:not(.mat-calendar-body-selected) {
  background-color: white;
}

Answer 2

我不喜欢使用::ng-deep，所以我的方法是添加 styles.css （适用于所有应用程序）一些喜欢

.noTodayDatepicker .mat-calendar-body-today:not(.mat-calendar-body-selected){
    border-color:transparent!important;
}
.noTodayDatepicker .mat-calendar-body-today:not(:hover):not(.mat-calendar-body-selected){
  background-color:transparent!important;
}
.noTodayDatepicker .mat-calendar-body-today.mat-calendar-body-selected {
    box-shadow: none;
}

然后你可以使用 pannelClass

  <mat-datepicker #picker panelClass="noTodayDatepicker"></mat-datepicker>

见stackblitz