Ionic Angularjs ui日历根据月份获取活动



嗨,我是angularjs的新手,我正在尝试使用jquery完整日历http://angular-ui.github.io/ui-calendar/角度版本。我的问题是,我是否能够在加载时获取所有事件。,是否可以获取点击next或prev的事件(基于获取特定月份事件的月份)?

加载时获取事件的代码

var calCurrentDate = $filter('date')(new Date(), 'yyyy-MM-dd');
$scope.init = function() {
        console.log('this is the new calCurrentDate'+calCurrentDate);
        $ionicLoading.show({template: '<i class="icon ion-loading-c"></i>'});
        var req = {
            method: 'GET', 
            url: link+'meal/calendar?api_token='+$localStorage.accessToken+'&start_date='+calCurrentDate+'&id=',
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        }
        console.log(req);
        $http(req).success(function(data) { 
            $scope.schedule = data.dayplan;
            for(i in $scope.schedule) {
                $scope.events.push({
                    id: $scope.schedule[i].id,
                    title: '.',
                    start:   $scope.schedule[i].day,
                    color: $scope.schedule[i].color_code
                });
            }
            $ionicLoading.hide(); 
        }).error(function(data) { 
            console.log(data.message); 
            $ionicLoading.hide(); 
        });
    };

点击下一个或上一个,我可以得到月份和日期,我会尝试这样的

$scope.renderView = function(view){    
    var date = new Date(view.calendar.getDate());
    $scope.arrowDate = $filter('date')(date, 'yyyy-MM-dd');
    if($scope.arrowDate != calCurrentDate){
        calCurrentDate = $scope.arrowDate;
        $scope.init(calCurrentDate);
    }
};

也尝试过这样的

$scope.renderView = function(view){    
    var date = new Date(view.calendar.getDate());
    $scope.arrowDate = $filter('date')(date, 'yyyy-MM-dd');
    if($scope.arrowDate != calCurrentDate){
        $ionicLoading.show({template: '<i class="icon ion-loading-c"></i>'});
        var req = {
            method: 'GET', 
            url: link+'meal/calendar?api_token='+$localStorage.accessToken+'&start_date='+$scope.arrowDate+'&id=',
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        }
        console.log($scope.arrowDate);
        $http(req).success(function(data) { 
            $scope.schedule = data.dayplan;
            for(i in $scope.schedule) {
                $scope.events.push({
                    id: $scope.schedule[i].id,
                    title: '.',
                    start:   $scope.schedule[i].day,
                    color: $scope.schedule[i].color_code
                });
            }
            $ionicLoading.hide(); 
        }).error(function(data) { 
            console.log(data.message); 
            $ionicLoading.hide(); 
        });
    }
};

问题是它获取了数据,但又回到了当月(例如:如果当前月份是二月,如果我点击下一步,我可以获取三月的数据,但它会回到二月,而不是停留在三月)任何帮助都将不胜感激。提前谢谢。

答案是关于$scope.event.push这里是我如何处理的

if($scope.arrowDate != calCurrentDate){
            $ionicLoading.show({template: '<i class="icon ion-loading-c"></i>'});
            var req = {
                method: 'GET', 
                url: link+'meal/calendar?api_token='+$localStorage.accessToken+'&start_date='+$scope.arrowDate+'&id=',
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}
            }
            $http(req).success(function(data) { 
                console.log(data.message); 
                $scope.schedule = data.dayplan;
                var tmpEvent = [];
                for(i in $scope.schedule) {
                    tmpEvent.push({
                        id: $scope.schedule[i].id,
                        title: '.',
                        start:   $scope.schedule[i].day,
                        color: $scope.schedule[i].color_code
                    });
                }
                uiCalendarConfig.calendars.myCalendar.fullCalendar('removeEvents');
                uiCalendarConfig.calendars.myCalendar.fullCalendar( 'addEventSource', tmpEvent); 
                $scope.fetchMeal($scope.arrowDate);
                $ionicLoading.hide(); 
            }).error(function(data) { 
                console.log(data.message); 
                $ionicLoading.hide(); 
            });
        }

相关内容

  • 没有找到相关文章

最新更新