calendar - ionic 2 日历 cssClass 不工作

Question

我正在使用 https://github.com/HsuanXyz/ion2-calendar在 ionic 中生成日历。我无法使用 dateconfig 的 cssClass 对日期进行颜色更改。

下面是我使用的代码

` daysConfig() {

let _daysConfig = [
  {
    date:new Date(2018,0,1),
    subTitle:'New Year\'s',
    marked:false,
    cssClass: 'my-cal'
  },
  {
    date:new Date(2017,1,14),
    subTitle:'Valentine\'s',
    disable:true
  },
  {
    date:new Date(2017,3,1),
    subTitle:'April Fools',
    marked:true
  },
  {
    date:new Date(2017,3,7),
    subTitle:'World Health',
    marked:true
  },
  {
    date:new Date(2017,4,31),
    subTitle:'No-Smoking',
    marked:true
  },
  {
    date:new Date(2017,5,1),
    subTitle:'Children\'s',
    marked:true
  }
];

_daysConfig.push(...this.days);

this.calendarCtrl.openCalendar({
  from: new Date(2017,0,1),
  to  : new Date(2018,11.1),
  daysConfig:_daysConfig
})
  .then( (res:any) => { console.log(res) })
  .catch( () => {} )

}`

CSS类.my-cal {
颜色:黄色
}

Answer 1

经过将近 5 小时的长时间研发可以解决此问题。

请在 ionic 中找到以下解决方案

在 global.scss 中定义下面的类

.my-cal {
    background-color: red !important;
}

记住不要在其他任何地方定义这个类。

现在在您的日常配置中使用它，如下所示:

let _daysConfig: DayConfig[] = [];
    for (let i = 0; i < 31; i++) {
      _daysConfig.push({
        date: new Date(2020, 4, i + 1),
        marked: false,
        subTitle: `$${i + 1}`,
        cssClass: 'my-cal'
      })
    }

希望它能对某人有所帮助:)