Question

在更改事件源中的元素后，我无法更新uiCalendar。

日历在模板中定义为：

<div ui-calendar="uiConfig.calendar" class="span8 calendar" ng-model="EC.calendarEvents" calendar="eventsCalendar"></div>

当我添加或删除EC.calendarEvents中的元素时，日历不会更新。

我已尝试以下所有语句，尝试在修改EC.calendarEvents后尝试刷新日历：

uiCalendarConfig.calendars['eventsCalendar'].fullCalendar('render');
uiCalendarConfig.calendars['eventsCalendar'].fullCalendar('rerenderEvents');
uiCalendarConfig.calendars['eventsCalendar'].fullCalendar('refetchEvents');

我还尝试删除并重新添加来源：

uiCalendarConfig.calendars['eventsCalendar'].fullCalendar('removeEvents');
uiCalendarConfig.calendars['eventsCalendar'].fullCalendar('addEventSource', $scope.EC.calendarEvents);

但这只会导致以下错误显示在控制台中：

TypeError: Cannot read property 'hasTime' of undefined

错误发生在第12272行normalizeEventTimes函数的fullcalendar.js中。

错误行是：

eventProps.allDay = !(eventProps.start.hasTime() || (eventProps.end && eventProps.end.hasTime()));

在这篇文章中，他们建议保持对数组的相同引用并推送/拼接事件进出：AngularJS UI-calendar not updating events on Calendar

我也尝试了这个，但它没有任何区别。

Answer 1

问题证明是ui-calendar希望在其中接收事件的格式不一致。

当控制器加载并填充EC.calendarEvents时，ui-calendar期望接收一组数组。所以赋值如下：

$scope.EC.calendarEvents = [createCalendarEventsFromCoreEvents(coreEvents)];

但是，每当我想要改变EC.calendarEvents时，它必须只是一个数组，而不是一个数组数组。

因此EC.calendarEvents的后续更新如下所示：

$scope.EC.calendarEvents = createCalendarEventsFromCoreEvents(filterEvents());
uiCalendarConfig.calendars['eventsCalendar'].fullCalendar('removeEvents');
uiCalendarConfig.calendars['eventsCalendar'].fullCalendar('addEventSource', $scope.EC.calendarEvents);

请注意[]周围缺少括号createCalendarEventsFromCoreEvents。

添加或删除事件时uiCalendar不会刷新

1 个答案: