Jquery 实现角度ui日历外部元素的拖放功能

Jquery 实现角度ui日历外部元素的拖放功能,jquery,angularjs,drag-and-drop,typescript,fullcalendar,Jquery,Angularjs,Drag And Drop,Typescript,Fullcalendar,我正在使用为AngularJS提供的ui日历插件,它基于Fullcalendar jQueryUI插件。我想要的是像Fullcalendar演示一样实现外部事件的拖放功能。但是默认情况下没有为AngularUI日历提供,所以我做了一些研究 现在我可以拖动一个外部元素,把它放到日历上,日历检测到这个元素,但是我不知道如何让这个元素放到日历上 Doc说可以用这个标记检索元素,但是当我调用$(this.data('eventObject')时,我什么都没有 这里是我的日历控制器(我对AngularJS

我正在使用为AngularJS提供的ui日历插件,它基于Fullcalendar jQueryUI插件。我想要的是像Fullcalendar演示一样实现外部事件的拖放功能。但是默认情况下没有为AngularUI日历提供,所以我做了一些研究

现在我可以拖动一个外部元素,把它放到日历上,日历检测到这个元素,但是我不知道如何让这个元素放到日历上

Doc说可以用
这个
标记检索元素,但是当我调用
$(this.data('eventObject')时,我什么都没有

这里是我的日历控制器(我对AngularJS使用Typescript):

导出类日历Ctrl{
静态$inject=['planningService'];
公共活动:任何;
公共uiConfig:任何;
公共警报消息:字符串;
公共事件来源:任何;
已规划的公共事件:数组;
建造商(规划服务:规划服务){
//事件
this.events=planningService.geteventsplaned();
/*配置对象*/
this.uiConfig={
日历:{
朗:“fr”,
真的,
滴:这个,onDrop,
身高:450,
是的,
标题:{
左:“上一个,下一个今天”,
中心:'标题',
右图:“月,agendaWeek,agendaDay”
},
事件单击:this.alertOnEventClick,
eventDrop:this.alertOnDrop,
eventResize:this.alertOnResize
}
};
/*事件源阵列*/
this.eventSources=[this.events];
}
公共onDrop(日期:日期,全天:布尔值){
警报('已在日历上删除!全天:'+AllDay+'日期:'+Date+'+$(this.data('eventObject'));
var originalEventObject=$(this.data('eventObject');
var copiedEventObject=$.extend({},originalEventObject);
copiedEventObject.start=日期;
copiedEventObject.allDay=全天;
$(“#干预计划”).fullCalendar('renderEvent',copiedEventObject,true);
如果($('#drop remove')。是(':checked')){
$(this.remove();
}
}
/*事件消息单击*/
public alertOnEventClick(事件:任意、全天:任意、jsEvent:任意、视图:任意){
this.alertMessage=(event.title+':Clicked');
}
/*投递信息*/
公共alertOnDrop(事件:任意、日期增量:任意、分钟增量:任意、全天:任意、回复函数:任意、jsEvent:任意、ui:任意、视图:任意){
this.alertMessage=(event.title+':删除以使dayDelta'+dayDelta);
}
/*关于调整大小的消息*/
public alertOnResize(事件:任意、dayDelta:任意、分钟Delta:任意、revertFunc:任意、jsEvent:任意、ui:任意、视图:任意){
this.alertMessage=(event.title+':调整大小以使dayDelta'+minuteDelta);
}
}
我的HTML:

<div class="wrapper wrapper-content" ng-controller="CalendarCtrl as calendar">
    <div id="interventionPlanning" ui-calendar="calendar.uiConfig.calendar" calendar="interventionPlanning" class="calendar" ng-model="calendar.eventSources"></div>
</div>

有人找到了解决办法吗?与我的问题相关的帖子很多,但我没有找到解决办法。

我发现:

        $scope.uiConfig = {
            calendar: {
                droppable: true,
                drop:function(data) {
                    alert("I got droped!" + new Date(data));
                }
            }
        };
我还在努力,但你可以从这一点上找到解决办法

祝你好运

        $scope.uiConfig = {
            calendar: {
                droppable: true,
                drop:function(data) {
                    alert("I got droped!" + new Date(data));
                }
            }
        };