Full Calendar is not displayed at the beginning.

[Nextt1]

I am using angular-material design library. Now in a specific view I am trying to load full-calendar but it not displayed at first. As soon as I click any header buttons the calendar will be displayed as desired. but I want to display as soon as I change to this view. Here is my View file

<md-content layout="column" layout-align="center center">
   <div ui-calendar="uiConfig.calendar" ng-model="eventSources">
   </div>
 </md-content>  

Controller File

 $scope.eventSources = [];

$scope.uiConfig = {
    calendar:{
        height: 560,
        defaultView: 'basicWeek ',
        header:{
            left: 'month agendaWeek agendaDay',
            center: 'title',
            right: 'today prev,next'
        }
}
};

I am not getting any error on my console.

[flick36]

Did you manage to solve this? i'm having the same issue

[martin-langhoff]

FC might not be entirely happy with some modes of show/hide. Some folks have hit issues with FC nested inside an 'accordion'. Google for that and perhaps one of the workarounds works for you :-)

[flick36]

Thing is i have the calendar in the index, and won't render either.... until i press the buttons.

[flick36]

I've managed to get it working by adding a timeout function in the code in line 257 insted of

calendar.fullCalendar(options);

I've changed it to:

setTimeout(function () {
    calendar.fullCalendar(options);
});

[Nextt1]

Thanks for the answer. It is working for me now.

[Ric17101]

@flick36 , may I know sir what would be the value of options as parameter on .fullCalendar? Thanks!

[alexismansilla]

Thank! for workaround @flick36 it is working for me.