问题描述
我在一个项目中使用了 Angular Material Calendar,并试图阻止选择今天之前的日期,所以我尝试了 [min] 约束,但这并不能解决今天日期的 luxon 创建问题,所以每天,最小的日期根据好日子移动。
有什么好的办法吗? 我在这里隔离了我的日历: https://stackblitz.com/edit/angular-swrr7s?devtoolsheight=33&file=src/app/date-range-picker-overview-example.html
谢谢
解决方法
在您的 stackblitz 中它不起作用,因为 Date.now() 返回一个包含毫秒数的数字而不是日期对象。如果您将代码更改为:
verbose 0.845938752 Request "https://gitlab.trustify.dev/api/v4/packages/npm/@trustifych%2freview-importer" finished with status code 200.
[...]
verbose 2.567404115 Performing "GET" request to "https://gitlab.myorg.com/api/v4/projects/8/packages/npm/@myorg/mypackage/-/@myorg/mypackage-1.0.1.tgz".
verbose 2.669180133 Error: https://gitlab.myorg.com/api/v4/projects/8/packages/npm/@myorg/mypackage/-/@myorg/mypackage-1.0.1.tgz: Request failed "404 Not Found"
at ResponseError.ExtendableBuiltin (/usr/local/lib/node_modules/yarn/lib/cli.js:696:66)
at new ResponseError (/usr/local/lib/node_modules/yarn/lib/cli.js:802:124)
at Request.<anonymous> (/usr/local/lib/node_modules/yarn/lib/cli.js:67058:16)
at Request.emit (events.js:315:20)
at Request.module.exports.Request.onRequestResponse (/usr/local/lib/node_modules/yarn/lib/cli.js:141539:10)
at ClientRequest.emit (events.js:315:20)
at HTTPParser.parserOnIncomingClient (_http_client.js:641:27)
at HTTPParser.parserOnHeadersComplete (_http_common.js:126:17)
at TLSSocket.socketOnData (_http_client.js:509:22)
at TLSSocket.emit (events.js:315:20)
error An unexpected error occurred: "https://gitlab.myorg.com/api/v4/projects/8/packages/npm/@myorg/mypackage/-/@myorg/mypackage-1.0.1.tgz: Request failed \"404 Not Found\"".
关于 luxon - 这可能无法开箱即用,因为只有两个内置日期适配器:today = new Date();
和 MatNativeDateModule
。您必须 create your own DateAdapter 才能与 luxon 一起使用 - 它在 datepicker 文档中有很好的记录。你应该能够基于你的时刻,因为 luxon 似乎从时刻借用了一点。
以下方法可以解决您的问题:
在 .ts 文件中
//today's date
todayDate:Date = new Date();
在 .html 文件中
<mat-form-field>
<input matInput [matDatepicker]="picker" [min]="todayDate" placeholder="Date" formControlName="date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>