ui-angular 全日历刷新问题

Question

我正在使用 ui-calendar 来显示事件。为了填充日历模型，控制器从工厂获取事件。奇怪的部分（我想不通）是，当工厂从 API 获取数据时，日历会很好地显示事件。但是，为了稍微“加快速度”，工厂将 api 获取的数据保存在局部变量中。如果 Factory returns 来自局部变量的数据，则日历不显示事件。但是，如果来自 API 的工厂 returns 数据，事件显示得很好（所以我从工厂返回局部变量数据的方式一定有问题）。

Factory方法如下：

function getAll() {
    if (!_allEventsRequiresUpdate && _allEvents) {
        var deferred = $q.defer();
        deferred.resolve(_allEvents);
        return deferred.promise;
    }
    else {
        var request = $http({
            method: "Get",
            url: baseUrl
        });
        return request.then(function (response) {
            _allEvents = response.data;
            _allEventsRequiresUpdate = false;
            return response.data;
        }, handleError);
    }

}

当从 API 获取数据时，_allEvents 变量被填充。两种情况下的数据（从 API 或局部变量返回）完全相同（至少据我所知），但是，如前所述，只有从 API 获取的数据得到在 ui-calendar/fullcalendar.

中呈现

有什么想法吗？我从工厂返回局部变量的方式有问题吗？

顺便说一句，在这两种情况下，控制器都会解决承诺。

UPDATE

下面是Angular控制器中从工厂获取数据的方法：

function getAllEvents() {
    serviceAppointmentsServices.getAll()
        .then(function (data) {
            vm.events = angular.copy(data);
            vm.fullCalendarEvents = [];

            for (var i = 0; i < vm.events.length; i++) {
                var event = {
                    id: vm.events[i].xrmId,
                    title: vm.events[i].xrmName,
                    start: moment(vm.events[i].startDate).tz('America/Santiago'),
                    end: moment(vm.events[i].endDate).tz('America/Santiago'),
                    stick: true
                }
                if (vm.events[i].xrmStatus.value == 1)
                    event.color = '#D2A15D';
                vm.fullCalendarEvents.push(event);
            }

            uiCalendarConfig.calendars["calendar"].fullCalendar('removeEventSources');
            uiCalendarConfig.calendars["calendar"].fullCalendar('addEventSource', vm.fullCalendarEvents);

        }, function (mesage) {
            toastr.error(mesage, "error!");
        });
}

这是日历配置：

vm.uiConfig = {
    calendar: {
        height: 450,
        editable: true,
        eventClick: editEvent,
        dayClick: addEvent,
        eventDrop: $scope.alertOnDrop,
        eventResize: $scope.alertOnResize,
        eventAfterAllRender: documentReady,
        locale: 'es',
        timezone: 'America/Santiago',
        customButtons: {
            addEvents: {
                text: 'nuevo',
                click: function () {
                    vm.fx.addEvent();
                    $scope.$apply()
                }
            }
        },
        header: {
            left: 'month basicWeek basicDay agendaWeek agendaDay',
            center: 'title',
            right: 'addEvents today prev,next'
        },
        eventRender: eventRender

    }
};

Answer 1

我发布了答案，以防其他人遇到同样的问题。感谢@Javarome（https://whosebug.com/users/650104/javarome) in the post: Directive is being rendered before promise is resolved。我听从了他的建议，一切都很顺利。

总结：问题是指令在控制器中解决承诺之前被触发。所以我按照他的建议将指令包装在 ng-if 中（需要将变量解析为触发器，瞧！！！像这样的东西：

<div class="container" ng-if="vm.fullCalendarEvents">
    <div class="calendar" ng-model="eventSources" calendar="calendar" config="uiConfig.calendar" ng-disabled="waitingForHttp" ui-calendar="vm.uiConfig.calendar" ></div>
</div>

ui-angular 全日历刷新问题

ui-angular fullcalendar refresh issue

fullcalendar

angularjs

angular-ui