Question

我设法使重复发生的事件显示在日历上，但是我的单个allDay事件不会显示，并且我相信这是一个现场问题。

我尝试将事件的开始时间设为iso日期，这似乎无关紧要，因为我的重复事件被保存为字符串。

这是重复发生的事件，并显示在日历上

{
    "_id" : ObjectId("5d4af079f91ff532f8fc0385"),
    "daysOfWeek" : [ 
        1, 
        2, 
        3
    ],
    "locationId" : ObjectId("5d28cad23f49646797e05adc"),
    "allDay" : true,
    "start" : "2019-08-07",
    "end" : "2019-08-07",
    "startRecur" : "2019-08-07",
    "endRecur" : "2019-08-31",
    "title" : "Change Bulbs",
    "backgroundColor" : "rgb(87, 87, 244)",
    "source" : null,
    "interval" : "Weekly",
    "category" : "Facility",
    "monday" : true,
    "tuesday" : true,
    "wednesday" : true,
    "completed" : false,
    "frequency" : null,
    "__v" : 0
}

这是在FC-v3中显示但在v4中不会显示的单个事件

{
    "_id" : ObjectId("5d4b455e121f726f510f2b5c"),
    "daysOfWeek" : [],
    "batchId" : ObjectId("5d28f52d823083adfc6e8c4d"),
    "locationId" : ObjectId("5d28cad23f49646797e05adc"),
    "end" : null,
    "startRecur" : "",
    "endRecur" : "",
    "allDay" : true,
    "start" : "2019-08-08",
    "title" : "First Transplant",
    "backgroundColor" : "rgb(87, 87, 244)",
    "interval" : "Single Event",
    "category" : "Cultivation",
    "monday" : false,
    "tuesday" : false,
    "wednesday" : false,
    "thursday" : false,
    "friday" : false,
    "saturday" : false,
    "sunday" : false,
    "completed" : false,
    "__v" : 0
}

所以我创建了一个具有正确ISO日期的事件，但它也失败了

{
    "_id" : ObjectId("5d4b4f9a56114f747c7ddcef"),
    "daysOfWeek" : [],
    "batchId" : ObjectId("5d28f52d823083adfc6e8c4d"),
    "locationId" : ObjectId("5d28cad23f49646797e05adc"),
    "allDay" : true,
    "start" : ISODate("2019-08-08T00:00:00.000Z"),
    "end" : null,
    "title" : "IMP",
    "backgroundColor" : "rgb(87, 87, 244)",
    "interval" : "Single Event",
    "category" : "Cultivation",
    "monday" : false,
    "tuesday" : false,
    "wednesday" : false,
    "thursday" : false,
    "friday" : false,
    "saturday" : false,
    "sunday" : false,
    "completed" : false,
    "__v" : 0
}

comp.ts代码

createEvent(form) {
        if (form.valid) {
            this.newEvent.category = 'Cultivation';
            this.newEvent.completed = false;
            this.newEvent.allDay = true;
            this.newEvent.locationId = this.selectedLocation._id;
            this.newEvent.batchId = this.selectedBatch._id;
            this.newEvent.start = moment(this.newEvent.start).utc();
            this.newEvent.start.hours(0).minutes(0).seconds(0);
            // this.newEvent.source =  null;
            // this.newEvent.daysOfWeek = [];
            if (this.newEvent.interval === 'Single Event') {
                this.newEvent.end = null;
                // this.newEvent.startRecur = '';
                // this.newEvent.endRecur = '';
                this.newEvent.monday = false;
                this.newEvent.tuesday = false;
                this.newEvent.wednesday = false;
                this.newEvent.thursday = false;
                this.newEvent.friday = false;
                this.newEvent.saturday = false;
                this.newEvent.sunday = false;
            }
            // if ( this.newEvent.interval === 'Daily'  || this.newEvent.interval === 'Weekly'){
            // }
            if (this.newEvent.interval === 'Weekly') {
                this.newEvent.startRecur = this.newEvent.start;
                this.newEvent.end = this.newEvent.start;
                this.newEvent.frequency = NaN;
                if (this.newEvent.sunday) {
                    this.newEvent.daysOfWeek.push(0);
                }
                if (this.newEvent.monday) {
                    this.newEvent.daysOfWeek.push(1);
                }
                if (this.newEvent.tuesday) {
                    this.newEvent.daysOfWeek.push(2);
                }
                if (this.newEvent.wednesday) {
                    this.newEvent.daysOfWeek.push(3);
                }
                if (this.newEvent.thursday) {
                    this.newEvent.daysOfWeek.push(4);
                }
                if (this.newEvent.friday) {
                    this.newEvent.daysOfWeek.push(5);
                }
                if (this.newEvent.saturday) {
                    this.newEvent.daysOfWeek.push(6);
                }
            }
...sub to database

Answer 1

设置"daysOfWeek" : [],意味着您要告诉日历它不能显示一周中的任何一天的事件。这就是为什么它不会出现的原因。

只需在代码中不为单个事件设置该选项，就可以了：

{
    "_id" : ObjectId("5d4b455e121f726f510f2b5c"),
    "batchId" : ObjectId("5d28f52d823083adfc6e8c4d"),
    "locationId" : ObjectId("5d28cad23f49646797e05adc"),
    "end" : null,
    "startRecur" : "",
    "endRecur" : "",
    "allDay" : true,
    "start" : "2019-08-08",
    "title" : "First Transplant",
    "backgroundColor" : "rgb(87, 87, 244)",
    "interval" : "Single Event",
    "category" : "Cultivation",
    "monday" : false,
    "tuesday" : false,
    "wednesday" : false,
    "thursday" : false,
    "friday" : false,
    "saturday" : false,
    "sunday" : false,
    "completed" : false,
    "__v" : 0
}

演示：https://codepen.io/ADyson82/pen/LwdgeG

P.S。日期字符串没有问题。

FullCalendar-v4 allDay事件未呈现

1 个答案: