I am using full calendar in my angular 8 app. Everything is working fine, but I want to call a function whenever the currentView of calendar changes. that is, I want to call a function/event whenever I change its view from month to week, or week to days.
For clarity, I want to detect view template changes (not date range changes). And by detecting it I want to highlight the button of respective current view.
This is my html code.
<p-fullCalendar #fc [events]="allEvents" [options]="options"></p-fullCalendar>
This is my .ts code
this.options = {
plugins: [dayGridPlugin, timeGridPlugin, interactionPlugin],
defaultDate: moment().toDate(),
themeSystem: 'yeti',
header: {
left: 'prev,next',
center: 'title',
right: 'dayGridMonth,timeGridWeek,timeGridDay'
}, dateClick: (e) => {
this.dateClicked(e);
}, eventClick: (e) => {
this.eventClicked(e);
},
}
In fullCalendar 4 you can use the viewSkeletonRender callback - this runs whenever a new view template is loaded.
viewSkeletonRender: function(info)
{
console.log(info); //replace with whatever code you need.
}
UPDATE: As per https://fullcalendar.io/docs/v5/upgrading-from-v4 , since v5 this function has been superseded by viewDidMount
.