Angular 完整日历第 5 版-隐藏过去的日期或禁用点击过去的日期

问题描述

我正在开发一个膳食计划器,允许用户选择计划日期。 我不需要安排活动,我只需要点击日期(我只需要 dayClick)。

版本:

-1

代码

0 -(-1)

我目前看到的: 日历正确地变灰/禁用过去的日期而不显示数字。 问题是如果说开始是 24 号,日历看起来很难看。

我想要一种方式 (1) 日历从今天开始,即隐藏过去的日子。 (2) 禁用的过去日期看起来更好 - nos 显示并变灰,但它们不可点击。

解决方法

所以我不确定我对您关于将过去日期灰显作为同一周期的一部分的问题的后半部分有多大帮助,但我确实有一些与“Locales.html”配合使用的代码' 使用今天的日期创建变量的示例。还值得一提的是,我没有使用 angular 文件集(我想我有 react 文件)。你可以有效地插入这个

var theDate = new Date();
var dd = String(theDate.getDate()).padStart(2,'0');
var mm = String(theDate.getMonth() + 1).padStart(2,'0'); //January is 0!
var yyyy = theDate.getFullYear();

theDate = yyyy + '-' + mm + '-' + dd;

只需将此 document.addEventListener('DOMContentLoaded',function() 中的变量名称作为 initialDate 参数传递即可。

至于使数字变灰,您可以使用上面创建的日期变量 dd 作为 for 循环中的检查。类似的东西

function myFunction() {
for (i=0; i<dd; i++) {
document.getElementsByClassName("fc-daygrid-day-number").style.color = "#aaa"; }
}

我还不太擅长 javascript,但理论上应该将今天之前一个月的所有日期的颜色更改为灰色。在接下来的几个月里,您可能需要寻找一些方法来防止这些天变灰,但我希望这是一个起点!

,

您可以添加 firstDay:{getDay(new Date())} 以获取日期并从该日期开始日历