如何在有角日历周视图中使用ng-template以不同的颜色显示特定的一天时间

Question

我正在使用mattlewis Angular calendar为我的项目实施周视图。我需要在一周中的特定时间显示不同的背景颜色。

我找不到输入或其他方法（使用ng-template）以不同的背景颜色在周视图中呈现特定单元格。

我想要这样的东西，即每周视图中特定时间的背景以差异颜色显示。

需要建议/帮助。

谢谢。

请通过此stackblitz demo提出更改建议。

Answer 1

您可以选择-

import { Component, ChangeDetectionStrategy } from '@angular/core';
import { CalendarEvent } from 'angular-calendar';

@Component({
  selector: 'mwl-demo-component',
  changeDetection: ChangeDetectionStrategy.OnPush,
  templateUrl: 'template.html'
})
export class DemoComponent {
  view: string = 'month';

  viewDate: Date = new Date();



  events = [
    {
      start: '2019-05-02',
      title: 'A 3 day event',
      color: {
        primary: "#ad2121",
        secondary: "#FAE3E3"
      },
    },
  ]

}

我希望答案能对您有所帮助！

Answer 2

只需将颜色添加到您的活动中即可：

events = [
  {
    start: '2019-05-02',
    title: 'A 3 day event',
    color: {
      primary: "#ad2121",
      secondary: "#FAE3E3"
    },
  },
]

请参阅Stackblitz解决方案：https://stackblitz.com/edit/angular-edcv1t-bngiw7?embed=1&file=demo/component.ts

或者只需在项目的演示站点上单击事件。