问题描述
我正在使用AngularJS开发一个项目，并使用Angular-UI UI-Calendar。 在我的代码中，我将ui-calendar的eventSources模型初始化为空数组（[]），并将ui-config“ events parameter”设置为自定义函数。 该函数发出$ http请求，然后调用赋予事件函数的回调函数。
但是，我发现，当我加载页面或更改通过向左或向右按??钮查看的月份时，事件函数调用了两次。 我该如何解决？
这是我的代码：
function CalendarCtrl($scope, Data){ var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); // Stores all events var events = []; /* config object */ $scope.uiConfig = { calendar:{ height: 450, editable: true, header: { left: 'prev,next', center: 'title', right: 'month,agendaWeek,agendaDay' }, buttonText: { month: "Ay", week: "Hafta", day: "Gün", list: "Ajanda" }, allDayText: "Tüm gün", eventLimitText: "daha fazla", firstDay: 1, timeFormat: 'H:mm', axisFormat: 'H:mm', lazyFetching: true, // Here listen for calendar change events events: getEvents } }; // For angular ui-calendar element $scope.eventSources = []; // Calendar event handlers function getEvents(from, to, callback){ console.log(from); // For test purposes // Request for data from server and when it comes, call callback to update calendar Data.calendar.get(moment(from).unix(), moment(to).unix()).then(function(events){ angular.forEach(events, function(event){ event.start = moment.unix(event.start); if(event.end){ event.end = moment.unix(event.end); } else{ delete event.end; } var d = event.start; if(d.hour() == 0 && d.minute() == 0 && d.second() == 0){ event.allDay = true; } if(event.important){ event.className = "important-event"; } event.editable = true; }); callback(events); }); }
1楼
我有解决方案。
不必将事件处理程序注册到$ scope.uiConfig.calendar.events，而是将相同的函数注册到$ scope.eventSources数组。 像那样：
$scope.eventSources = [getEvents];
每当视图更改和日历需要数据时，它将查看$ scope.eventSources元素。 如果一个元素是一个函数，它将被调用，结果将显示在日历中。
2楼
我们在项目中遇到了类似的问题，我们的解决方案还包括在eventSource初始化中将空对象放入数组中。
$ scope.eventSources = [{}];