I am currently attempting to connect FireBase data with my fullCalendar plugin in an angular application. Unfortunately, it seems that the plugin is not compatible with data.$asObject() or data.$as Array().
Here is what I have implemented so far, but it is not displaying any meetings:
Controller:
(function () {
var app = angular.module("myCal");
app.controller('meetingsCtrl', meetingsCtrl);
function meetingsCtrl($scope, $http, $location, $firebase) {
var ref = new Firebase(firebaseurl); // actual URL
var meetings = $firebase(ref);
$scope.fireEvents = meetings.$asObject(); // Unable to get $asArray() working as well
} // controller func
})();
Directive:
(function () {
var app = angular.module("myCal");
app.directive("sbCalendar", function () {
return {
link: function (scope, element, attrs) {
$(element).fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
eventLimit: true, // show "more" link for multiple events
aspectRatio: 4,
events: scope.fireEvents,
editable: true,
eventDrop: function (event, delta, revertFunc) {
} // event drop
}); // initializing fullCalendar & options
} // link
} // return
}); // directive
})();
This is the JSON file uploaded to Firebase (the Firebase URL points to "meetings"):
{
"meetings": {
"x1": {
"title": "test subject",
"start": "2016-10-20",
"end": "2016-10-20",
"description": "some long description test"
},
"x2": {
"title": "test2 subject",
"start": "2016-11-05",
"end": "2016-11-06",
"description": "another long description for test 2"
},
"x3": {
"title": "test3 new subject",
"start": "2016-11-11",
"end": "2016-11-11",
"description": "yet another description for test 3"
}
}
}