AngularJS ui-calendar - event model

Question

I am trying to set up the calendar according to the instructions. The calendar itself is displayed on the page, but it does not display any events.

Code in the template:

<div ui-calendar ng-model="eventSources">

Code in my controller:

 var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); $scope.eventSources = [ { "title": 'All Day Event', "start": new Date(y, m, d)}, { "title": 'Long Event', "start": new Date(y, m, d - 5), "end": new Date(y, m, d - 2)}]; 

When I go through eventSources in a template, it works:

 <li ng-repeat="e in eventSources"> {{e.title}} {{e.start}} </li> 

The calendar does not show anything. There are no errors in the console either. Do any of you have an idea of ​​what is going on here?

Answer 1

Use Only an array of events - this is the problem here. uiCalendar only accepts an eventSources array. http://arshaw.com/fullcalendar/docs/event_data/eventSources/

I believe that we should make it flexible enough to, however, all api sources.

Answer 2

This is how I load events using "eventsources:" I have an array of event sources: You have 2 ways to do this:

1- JSON (faster because the events are already formatted by JSON without the need for repeating) 2-Ajax call (slower because you need to iterate xml here)

  var othersources = { jsonsource: { url: ajaxcallURL(_url,"7"), type: 'POST', //error: function() { alert('something broke with courses...'); }, data:{ 'func':func, 'year':y }, cache: false, color: '#C1272D', textColor: 'white' }, ajaxcallsource: { events: function(start, end, callback) { $.ajax({ type: 'POST', url: ajaxcallURL(_url,"7"), data: { // our hypothetical feed requires UNIX timestamps start: Math.round(start.getTime() / 1000), end: Math.round(end.getTime() / 1000), 'func':func, 'year':y }, success: function(doc) { var events = []; var allday = null; //Workaround var Editable = null; //Workaround $(doc).find('event').each(function() { if($(this).attr('allDay') == "false") //Workaround allday = false; //Workaround if($(this).attr('allDay') == "true") //Workaround allday = true; //Workaround if($(this).attr('editable') == "false") //Workaround Editable = false; //Workaround if($(this).attr('editable') == "true") //Workaround Editable = true; //Workaround events.push({ id: $(this).attr('id'), title: $(this).attr('title'), start: $(this).attr('start'), end: $(this).attr('end'), allDay: allday, editable: Editable }); }); callback(events); } }); }, cache: false, //error: function() { alert('something broke with courses...'); }, color: '#C1272D', textColor: 'white', //className: 'course' } } //othersources array close 

Inside the calendar properties:

 eventSources:[othersources.jsonsource,ajaxcallsource], 

Luck