Angularjs Full Calendar doesn't display events

Question

I am using that https://github.com/angular-ui/ui-calendar to use the FullCalendar in Angularjs.

It displays the calendar and showing no errors;

        
                      

              相关标签:
       
      

Answer 1

I used

$scope.callCalendar = function (){
... ...
};

and in html file:

 <div ui-calendar="uiConfig.calendar" class="span8 calendar" ng-model="eventSources"></div>

The events doesn't show up in the calendar; but I found the $scope.events has correct value in console.log($scope.events).

Answer 2

What worked me is.

Instead of this.

$scope.eventSources = [$scope.myEvents, $scope.someOtherArray, $scope.otherEvents];

TRY THIS

$scope.eventSources.push($scope.myEvents);

Answer 3

Here, in your eventSources you have entered the events directly.

What you should do is provide a list of arrays in which you have stored your events. Something like this: $scope.eventSources = [$scope.myEvents, $scope.someOtherArray, $scope.otherEvents];

and in $scope.myEvents, you can put your events.

$scope.myEvents = [
  {
    title: 'All Day Test Event',
    start: new Date(y, m, 1)
  },
  {
    title: 'Long Test Event',
    start: new Date(y, m, d - 5),
    end: new Date(y, m, d - 2)
  },
  {
    title: 'Test Birthday Party',
    start: new Date(y, m, d + 1, 19, 0),
    end: new Date(y, m, d + 1, 22, 30),
    allDay: false
  }
];

$scope.someOtherArray, $scope.otherEvents can be some other source for events.

As far as colors are concerned, you can customize them either through events object or event source object

$scope.someOtherArray = [];
$scope.weeklyEvents = {
    color: '#656565',
    textColor: 'white',
    events: []
};
$scope.otherEvents = {
    color: '#B2B2B2',
    textColor: 'black',
    events: []
};

You can modify your code to use either of the above two mentioned approaches(Visit those links).