fullCalendar 中的拖放事件不起作用 angular

Question

我想为我的 fullCalendar 事件实现拖放功能。该功能使用户能够在日历中拖放事件以在另一天和时间更改他们的事件。

这是我的 html 代码：

<p-fullCalendar deepChangeDetection="true" [events]="events" [options]="calendarOptions"></p-fullCalendar>

这是 ts 文件

this.calendarOptions = {
      droppable: true,
      eventDragStart: function(a) {
        console.log("Drag start", a);
      },
      eventDragStop: function(a) {
        console.log("Drag stop", a);
      
      },

Answer 1

你说你想启用

users to drag and drop events within the calendar

但是，根据 fullCalendar 文档，droppable 选项...

Determines if external draggable elements or events from other calendars can be dropped onto the calendar.

（我的粗体）。

您需要设置的是 editable 选项，它...

Determines whether the events on the calendar can be modified. This determines if the events can be dragged and resized.

（再次，我的大胆）。

所以如果你设置

editable: true

在您的日历选项中，您应该会得到更好的结果。

参考文献：

fullCalendar 中的拖放事件不起作用 angular

Drop and Dragging events in fullCalendar does not work angular

javascript

angular

typescript

fullcalendar

fullcalendar-5