我正在尝试从 Angular Material 垫日历中删除月份标签。
这是stackblitz链接
https://stackblitz.com/edit/am-all-imports-mviy6e?file=styles.scss
<mat-calendar [dateClass]="dateClass()" [selected]="selectedDate" (selectedChange)="onSelect($event)"></mat-calendar>
onSelect(event){
console.log(event);
this.selectedDate = event;
}
dateClass() {
return (date: Date): MatCalendarCellCssClasses => {
const highlightDate = this.datesToHighlight
.map(strDate => new Date(strDate))
.some(d => d.getDate() === date.getDate() && d.getMonth() === date.getMonth() && d.getFullYear() === date.getFullYear());
return highlightDate ? 'special-date' : '';
};
}
对于 CSS:-
.mat-calendar-body-label{
display: none;
}
如果我使用上面的 css 代码,它会从左到右移动日历日期并使日历扭曲。
如果我使用这个:-
.mat-calendar-body-label{
opacity: 0;
}
如果没有日期,它将留下空行
最佳答案
此外:
.mat-calendar-body-label{
opacity: 0;
}
添加以下内容以消除第一列上一个月的第一天开始时的额外空间:
.mat-calendar-body-label[colspan="7"] {
display: none;
}
关于angular - 自定义 mat-calendar,删除月份标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58826190/