在ng-pick-datetime中更改给定日期的样式

时间:2019-01-08 19:18:26

标签: angular npm datetimepicker

我在前端使用Angular Date Time Picker

后端中的我的方法为用户计算所有不可用的日期。我想在用户不可用的每一天更改日历中的颜色。基本上,我想找到一种通过在不可用的日子更改颜色来对组件进行样式设置的方法。

我似乎找不到办法;有人可以指出我正确的方向吗?甚至可能推荐另一种方法。

2 个答案:

答案 0 :(得分:0)

过滤掉不可用的日期,然后此CSS应该可以解决问题:

.owl-dt-calendar-cell-disabled {
  color: #ff0000;
}

它基本上将任何禁用日期的颜色设置为红色。

答案 1 :(得分:0)

在这里您可以更改颜色 -----> node_modules \ ng-pick-datetime \ assets \ style \ picker.min.css

.owl-dt-calendar-table .owl-dt-calendar-cell-in-range {
    background: rgba(255, 0, 0, 0.2);
}

.owl-dt-container-info .owl-dt-container-info-active {
    color: red;
}

.owl-dt-calendar-table .owl-dt-calendar-cell-selected {
    color: rgba(255, 255, 255, .85);
    background-color: red;
}

image here