繁体   English   中英

Material Angular v10 Datepicker 不适用于 min 和 max

[英]Material Angular v10 Datepicker not working with min and max

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

闪电战链接

如果我删除

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

我能够选择日期。

我确实与他们的 api 文档进行了交叉验证,但我无法在他们的 api 上通知任何更改。

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

请让我知道我在更新中遗漏了什么。

我将示例中的ts 和 html 调整为您的文件,现在应该可以正常工作了:

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>

我没有片刻就试过了,它正在工作。

你可以这样做,

  minDate: Date;
  maxDate: Date;

  constructor() {
    const currentYear = new Date().getFullYear();
    this.minDate = new Date(currentYear - 1, 0, 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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM