Material Angular v10 Datepicker无法使用最小和最大

如何解决Material Angular v10 Datepicker无法使用最小和最大

我在v 9.x上有一个工作日期选择器。该项目已升级到v10，现在在日期选择器中日期是不可选择的

如果我删除了

[min]="min.startDate" [max]="min.endDate"

我能够选择日期。

我确实对他们的api文档进行了交叉验证，没有任何更改可以通知他们的api。

https://material.angular.io/components/datepicker/api

请让我知道我在更新中错过了什么。

解决方法

我已经尝试了一下，它正在工作。

您可以这样做

  minDate: Date;
  maxDate: Date;

  constructor() {
    const currentYear = new Date().getFullYear();
    this.minDate = new Date(currentYear - 1,1); // 2019 January 1st
    this.maxDate = new Date(currentYear + 1,11,31); // 2021 December 31st
  }

文档中的示例-https://stackblitz.com/angular/jampmjpoympg?file=src%2Fapp%2Fdatepicker-min-max-example.ts

我将ts和html从example调整为您的files 现在应该可以正常工作了：

import { Component,VERSION } from "@angular/core";
import { FormBuilder } from "@angular/forms";
import moment from "moment";
import { Moment } from 'moment';
@Component({
  selector: "my-app",templateUrl: "./app.component.html",styleUrls: ["./app.component.css"]
})
export class AppComponent {
  minDate: Moment;
  maxDate: Moment;

  constructor() {
    this.minDate = moment().subtract(1,'year');
    this.maxDate = moment();
  }
}

<mat-form-field class="example-full-width" appearance="fill">
  <mat-label>Choose a date</mat-label>
  <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="picker">
  <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
  <mat-datepicker #picker></mat-datepicker>
</mat-form-field>

<div>
{{minDate}}

</div>
<div>
{{maxDate}}
</div>