Angular Syncfusion Scheduler-将颜色设置为单个事件

Question

我正在使用Angular EJ2 Syncfusion Scheduler，但是我不能为每个事件设置单独的颜色，我只能为同一行中的一组事件设置颜色。

示例：在下面的调度程序中，我想为David设置蓝色，为Peter设置红色。我只能为一行事件设置相同的颜色，而不能为单个事件设置相同的颜色。

https://ej2.syncfusion.com/angular/demos/?_ga=2.228039129.553863759.1586967379-1144123233.1586967379#/material/schedule/external-drag-drop

Answer 1

事件的背景色是根据colorField设置的。如果要为每个事件设置单独的颜色，则应删除colorField并在事件对象中包括自定义字段以保持颜色。

 {
    Id: 10,
    Name: "David",
    StartTime: new Date(2018, 7, 1, 9, 0),
    EndTime: new Date(2018, 7, 1, 10, 0),
    Description: "Health Checkup",
    DepartmentID: 1,
    ConsultantID: 1,
    DepartmentName: "GENERAL",
    CategoryColor: "Blue"
  }

并且通过使用如下所示的eventRendered事件，在事件渲染时将此颜色字段应用于事件。

oneventRendered(args: EventRenderedArgs): void {
        let categoryColor: string = args.data.CategoryColor as string;
        if (!args.element || !categoryColor) {
            return;
        }
        if (this.scheduleObj.currentView === 'Agenda') {
            (args.element.firstChild as HTMLElement).style.borderLeftColor = categoryColor;
        } else {
            args.element.style.backgroundColor = categoryColor;
        }
    }

有关更多参考，请参考下面的演示链接，并再次获得我们的帮助。

示例：https://stackblitz.com/edit/angular-udwvvf-fbm7mw?file=app.component.ts

UG链接：https://ej2.syncfusion.com/angular/documentation/schedule/appointments/?no-cache=1#using-eventrendered-event