更改日期时动态加载数据

Question

这是我的日历对象

$scope.uiConfig = {
            calendar: {
                height: 450,
                editable: false,
                header: {
                    left: 'title',
                    center: '',
                    right: 'today prev,next'
                },
                eventClick: $scope.onEventClick,
                eventDrop: $scope.alertOnDrop,
                eventResize: $scope.alertOnResize,
                eventRender: $scope.eventRender,
                dayClick: $scope.onDayClick,
                viewRender: $scope.getData
            }
        };

和

     $scope.getData = function(view, element){
            $scope.intervalStartDate = new Date(view.start);
            $scope.intervalEndDate = new Date(view.end);
        $scope.managedEvents = Event.getFittingsForDateInterval({
            intervalStartDate : convertDate($scope.intervalStartDate),
            intervalEndDate : convertDate($scope.intervalEndDate)
        });
$scope.managedEvents.$promise.then(function(data){
    $scope.uiConfig.calendar.events = data;
});
    }

如果我删除

$scope.uiConfig.calendar.events = data;

没有数据正在填充，如果我包括它正在刷新和加载当月数据

它

第一次加载一月份的数据，每当我单击下个月图标时，它都会调用 2 月份的数据，日历再次重置为当前月份（它再次调用 $scope.getData）

data = [{start : some_date, end : some_date, title : event_name},{start : some_date, end : some_date, title : event_name},{start : some_date, end : some_date, title : event_name},{start : some_date, end : some_date, title : event_name},{start : some_date, end : some_date, title : event_name}];

我只想获取当前视图的数据，而不是一次获取所有数据。任何帮助将不胜感激。

Answer 1

控制器.js 代码： .

$scope.getEvents = function(){
            var obj = {};
            $scope.events = [];
            obj.startDate = new Date($scope.myView.intervalStart).getTime();
            obj.endDate = new Date($scope.myView.intervalEnd).getTime();
        if($scope.myView.name == "month"){
            obj.endDate = obj.endDate - 19801000;
        }
       //Give a call to database from here, in which obj contains
       // start and end of the view
        var getEventsPromise = masterCalendarAPI.getEvents(obj);
        getEventsPromise.then(function (response) {
            if(response.statusCode == 200){
               //Assign $scope.event the list object retrieved from database
           }
        },
        function (error) {
           console.log(error);
        });
    }
//Remember this method will be called on each view change with all details in 'view' object
     $scope.renderView = function (view) {
            $scope.myView = view;
            $scope.getEvents();
        } 
    $scope.uiConfig = {
                calendar: {
                    height: 500,
                    editable: false,
                    header: {
                        left: 'prev,next title',
                        center: '',
                        right: 'month,agendaWeek,agendaDay'
                    },
                    eventLimit: true,
                    views: {
                        month: {
                            eventLimit:3
                        }
                        },
                    columnFormat:'dddd',
                    timezone: 'local',
                    timeFormat: 'hh:mm a',
                    titleFormat:'MMMM D, YYYY',
                    slotDuration:'00:30:00',
                    eventRender:$scope.eventRender,
                    eventClick: $scope.eventClicked,
                    dayClick: $scope.dayClick,
                    eventDrop: $scope.alertOnDrop,
                    eventResize: $scope.alertOnResize,
                    viewRender: $scope.renderView
                }
            } ;
//event sources array
    $scope.eventSources = [$scope.events];