我正在为一个非常奇怪的问题而发疯，我正在使用PrimeNG FullCalendar组件，这个：https ://primefaces.org/primeng/showcase/#/fullcalendar
这是基于Angular FullCalendar组件，这个：https ://fullcalendar.io/
特别是我正在尝试实现一种行为，例如将可拖动事件移动到日历中的最后一个链接。
与链接示例不同，我的可拖动事件有开始时间和结束时间。例如，我想将一个 evet 拖到我日历的特定日期，指定它从07:00开始并在15:00结束（这是因为我的日历代表一个工作班次日历，其中将人员放在特定的时间范围内工作）。
在这里你可以找到我的整个代码：https ://bitbucket.org/dgs_poste_team/soc_calendar/src/master/
好的，正如您在应用程序组件视图中看到的那样：
<div class="container">
<div class="row">
<div class="col-12">
<app-header></app-header>
</div>
<div class="row">
<div class="col-4">
<p>DRAGGABLE</p>
<app-people-list></app-people-list>
</div>
<div class="col-8">
<app-fullcalendar></app-fullcalendar>
</div>
</div>
</div>
</div>
左侧是<app-people-list>显示事件\人员列表的组件，我可以将其拖到我的日历中以进行特定的工作班次。
在右侧，我有<app-fullcalendar>渲染我的日历的组件。
进入PeopleListComponent类（app-people-list组件的控制器）我有这个ngAfterViewInit方法：
ngAfterViewInit() {
console.log("PEOPLE LIST ngAfterViewInit() START !!!")
var self = this
new Draggable(this.draggablePeopleExternalElement.nativeElement, {
itemSelector: '.fc-event',
eventData: function(eventEl) {
console.log("DRAG !!!");
console.log("SELECTED SHIFT: " + self.selectedShift.value);
//var returnedEvent = self.createEventObject(self.selectedShift.value, eventEl.innerText);
//return returnedEvent;
var returnedEvent = {
title: eventEl.innerText,
startTime: "18:00",
duration: {
hours: 8
}
};
return returnedEvent;
}
});
}
如您所见，它正在创建一个Draggable对象，用于将我列表中的事件\人员拖到日历中。目前它正在返回一个像这样的对象：
var returnedEvent = {
title: eventEl.innerText,
startTime: "18:00",
duration: { hours: 8 }
};
我把人\事件的标题放在哪里（它工作正常）。然后我把（现在它是静态的，然后我将它变成动态的）startTime那个是事件的开始时间（例如：我将人\事件拖到特定的一天，这意味着这个事件必须开始于事件被拖动当天的 18:00）以及duration事件在开始时间后 8 小时结束的含义。
好的，在这种情况下，它似乎工作“很好”，事实上，当我将一个人\事件拖到它出现在日历中的特定日期时，这里是一个截图：
例如，在上一个屏幕截图中，我将PERSONA 2事件拖到日期为 2017 年 2 月 22 日的那一天，它就在这里（其他事件来自我的代码中定义的静态事件数组）
注意到的第一个奇怪的事情是：我希望因此事件以指示开始时间的内容开始（至于 2 月 9 日的事件，以4p开始，表示该事件从该特定日期的 16:00 开始）。
好的，那么非常奇怪的事情：如果我将返回的事件对象的startTime属性更改为小于16:00的值，它就不再起作用了！！！
例如，使用：
var returnedEvent = {
title: eventEl.innerText,
startTime: "16:00",
duration: {hours: 8}
};
这意味着：活动从日历中所选日期的下午 4 点开始，并在同一天的 00:00 结束。当我将此事件拖到日历中时，该事件不会出现在日历上。没有渲染！！！它发生在startTime之前的所有 17:00，我不明白为什么。进入 JavaScript 控制台，我没有收到任何错误消息。
为了完整起见，进入FullcalendarComponent类（控制完整日历组件的类）我有：
@Component({
selector: 'app-fullcalendar',
templateUrl: './fullcalendar.component.html',
styleUrls: ['./fullcalendar.component.css']
})
export class FullcalendarComponent implements OnInit {
events: any[];
options: any;
header: any;
//people: any[];
@ViewChild('fullcalendar') fullcalendar: FullCalendar;
constructor(private eventService: EventService) {}
ngOnInit() {
this.eventService.getEvents().then(events => {
this.events = events;
});
this.options = {
plugins: [dayGridPlugin, timeGridPlugin, interactionPlugin, listPlugin],
defaultDate: '2017-02-01',
header: {
left: 'prev,next',
center: 'title',
right: 'dayGridMonth,timeGridWeek,timeGridDay'
},
editable: true,
dateClick: (dateClickEvent) => { // <-- add the callback here as one of the properties of `options`
console.log("DATE CLICKED !!!");
},
eventClick: (eventClickEvent) => {
console.log("EVENT CLICKED !!!");
},
eventDragStop: (eventDragStopEvent) => {
console.log("EVENT DRAG STOP !!!");
},
eventReceive: (eventReceiveEvent) => {
//console.log("EXTERNAL EVENT LAND ON THE CALENDAR. Title: " + eventReceiveEvent.event.title + " Selected shift: " + eventReceiveEvent.selectedShift);
//console.log("EXTERNAL EVENT LAND ON THE CALENDAR. Title: " + eventReceiveEvent.event.title + " Selected start: " + eventReceiveEvent.event.start);
console.log(eventReceiveEvent);
this.eventService.addEvent(eventReceiveEvent);
}
};
}
}
如您所见，它包含此方法：
eventReceive: (eventReceiveEvent) => {
//console.log("EXTERNAL EVENT LAND ON THE CALENDAR. Title: " + eventReceiveEvent.event.title + " Selected shift: " + eventReceiveEvent.selectedShift);
//console.log("EXTERNAL EVENT LAND ON THE CALENDAR. Title: " + eventReceiveEvent.event.title + " Selected start: " + eventReceiveEvent.event.start);
console.log(eventReceiveEvent);
this.eventService.addEvent(eventReceiveEvent);
}
接收人员列表组件发出的上一个事件并将此事件放入数组中（调用服务），它工作正常。
我真的不明白我的代码可能有什么问题，以及为什么使用startTime值<“17:00”它不起作用。
怎么了？我错过了什么？如何更改我的代码来解决这个问题？