I use the following calendar in Angular JS: angular-bootstrap-calendar
I have AJAX method that returns dates for this calendar:
$scope.showSchedule = function () {
appoService.getSchedule().then(function (response) {
calendarService.set(response.data.calendar, function (){
$scope.refleshCalendar();
});
});
};
Inside callback you can see method $scope.refleshCalendar();:
$scope.refleshCalendar = function () {
angular.forEach(calendarService.get(), function (item) {
$scope.vm.events.push(item);
});
};
This methos prepares data to native object $scope.vm.events and adds dates to calendar.
At response from AJAX I get array of objects as:
[{title: "Ola", type: "info", startsAt: "2015-10-31 17:00:00", resizable: true,…},…]
Full object is:
{incrementsBadgeTotal: true
recursOn: "year"
resizable: true
startsAt: "2015-10-31 12:00:00"
status: "1"
title: "Ola"
type: "info"}
My HTML code of calendar is:
<mwl-calendar
events="vm.events"
view="vm.calendarView"
view-title="vm.calendarTitle"
current-day="vm.calendarDay"
on-event-click="vm.eventClicked(calendarEvent)"
on-event-times-changed="vm.eventTimesChanged(calendarEvent); calendarEvent.startsAt = calendarNewEventStart; calendarEvent.endsAt = calendarNewEventEnd"
auto-open="true"
day-view-start="06:00"
day-view-end="23:00"
day-view-split="30"
cell-modifier="vm.modifyCell(calendarCell)">
</mwl-calendar>
Problems is that dates from AJAX is not displayed in this calendar.
I tried all...