angular bootstrap calendar not displaying

Question

I am trying to use the angular bootstrap calendar in my apache cordova app

HTML:

            <ion-view>
                <ion-content has-header="true" padding="true" ng-app="app" data-ng-controller="calendarController">
                    {{test}}
                    <mwl-calendar view="calendarView"
                      current-day="calendarDay"
                      events="events">
                </mwl-calendar>
                </ion-content>
            </ion-view>

Controller:

.controller('calendarController', ['$scope', '$state', 'moment', function ($scope, $state, moment) {

$scope.test = 'Test the controller';
$scope.calendarView = 'week';
$scope.calendarDay = new Date();
$scope.events = [
 {
     title: 'My event title', // The title of the event
     type: 'info',
     startsAt: new Date(2013, 5, 1, 1),
     endsAt: new Date(2014, 8, 26, 15),
     editable: false,
     deletable: false,
     incrementsBadgeTotal: true
 }
];
}]);

I have included the links to the relevant dependencies including moment.js however I get a message 'the value passed to current day attribute is not set'. I have made sure moment.js is linked before the main app.js file which contains the controller as suggested in a similar question but I still get the same message. I am new to angular and would appreciate any help that anyone can offer.

Answer 1

If you are using angular boostrap calendar, you need to know that some attribute are mandatory.

I don't see any view-date attribute define in your html file. Instead of

 current-day="calendarDay"

try:

 view-date="calendarDay"

You can check the README file of the official project for more details.