如在本plunkr示例中所示,可以添加一个新的事件,并且当事件被直接scope.events附加到$显示。 不过,如果我通过factory.events更新$ scope.events,不显示在日历的新事件。
http://plnkr.co/edit/BkdzJJ?p=preview
这必须是很简单的东西,我很想念,但我一直在这个问题了几个星期,现在挣扎。 能否请您帮忙吗?
app = angular.module('myApp');
function CalendarCtrl ($scope, gDataService) {
var today = new Date();
var m = today.getMonth();
var y = today.getFullYear();
var date = new Date();
var d = date.getDate();
$scope.events2 = []; // This gets data through gDataService
$scope.events3 = []; // This gets data directly from addEvent_direct method in this controller
// This is how I attempted to populate $scope.events2
$scope.$on('gDataUpdated', function(){
//alert(gDataService.events2.length);
$scope.events2 = gDataService.events2;
alert('gDataService # of events =' + gDataService.events2.length.toString()
+ '; $scope.events2 includes '+ $scope.events2.length.toString());
// The alert message indicates $scope.events is properly updated based on
// gDataService.events2, but the new event doesn't appear on the calendar.
});
// This is how $scope.events3 is successfully populated
$scope.addEvent_direct = function() {
var today = new Date();
var m = today.getMonth();
var y = today.getFullYear();
var d = today.getDate();
object = { title: 'Event directly added',
start: new Date(y, m, 28),
end: new Date(y, m, 29),
className: ['openSesame']}
$scope.events3.push(object);
}
// both events2 and events3 are included as eventSources
$scope.eventSources = [ $scope.events2 ,$scope.events3];
$scope.uiConfig = {
fullCalendar: {
height: 550,
editable: false
}
};
}
CalendarCtrl.$inject = [ '$scope','gDataService'];
//这是出厂从另一个控制器获取数据事件2(ButtonCtrl)
app.factory("gDataService", function ($rootScope) {
var service = {};
service.events = [];
service.events2 = [];
service.added_event_short = {start: null, title: null};
service.addData = function(object) {
this.events2.push(object);
//alert(this.events2.length);
$rootScope.$broadcast("gDataUpdated");
};
return service;
});
//这是为了测试不同的控制器如何能够通过工厂共享数据从CalendarCtrl分离的控制器
app.controller('ButtonCtrl', function($scope,gDataService) {
$scope.addEvent = function() {
var today = new Date();
var m = today.getMonth();
var y = today.getFullYear();
var d = today.getDate();
object = { title: 'Open Sesame',
start: new Date(y, m, 28),
end: new Date(y, m, 29),
className: ['openSesame']}
gDataService.addData(object);
}
});