I am trying to access the fullcalendar object in ui-calendar. The docs say that all I need to do is give the calendar attribute a name:
<div ui-calendar="calendarOptions" ng-model="eventSources" calendar="myCalendar">
Then, you should be able to access the calendar as such:
uiCalendarConfig.calendars.myCalendar
This is not working for me. The object I get back is always empty. What Im trying to ultimately do is programatically switch the view. If I was using just fullcalendar by itself, this is how I would do it:
.fullCalendar( 'changeView', viewName )
How do I do this using the ui-calendar directive?
Edit* My actual config object:
$scope.uiConfig = {
calendar:{
height: 700,
editable: true,
timezone:'America/Los Angeles',
ignoreTimezone:false,
header:{
left: 'month basicWeek basicDay agendaWeek agendaDay',
center: 'title',
right: 'today prev,next'
},
eventDrop: $scope.onEventDrop,
eventClick : $scope.onEventClick,
eventResize : $scope.onEventResize,
viewDisplay : $scope.onViewDisplay
}
};
My actual calendar directive call:
<div ui-calendar="uiConfig.calendar" ng-model="events" calendar="myCalendar"></div>
My controller:
app.controller('CalendarCtrl', function($scope, $http, $rootScope, uiCalendarConfig){
// bunch of methods plus $scope.uiConfig as shown above
// console.log(uiCalendarConfig) outputs {}
});
After looking to their site: http://angular-ui.github.io/ui-calendar/ , I found a solution.
You have to add uiCalendarConfig variable in your controller
angular.module('clientApp').controller('ControllerCtrl', function ($scope, uiCalendarConfig) { ... }
Add the calendar="yourCalendarName"
<div ui-calendar="uiConfig.calendar" ng-model="eventSources" class="calendar" calendar="yourCalendarName">
After that you can start using FullCalendar functions like this:
uiCalendarConfig.calendars.yourCalendarName.fullCalendar('unselect');
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With