2016-03-04 117 views
0

我已經安裝了所有組件,但日曆也不顯示。 我手工下載的時刻,在app.js注入角引導日曆不顯示日曆

模塊:

angular.module('app', ['ionic', 'app.controllers', 'app.routes', 'app.services', 'app.directives','ngCordova','angularMoment','mwl.calendar', 'ui.bootstrap']) 

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
    // for form inputs) 
    if(window.cordova && window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
    } 
    if(window.StatusBar) { 
     // org.apache.cordova.statusbar required 
     StatusBar.styleDefault(); 
    } 
    }); 
}) 

控制器:

.controller('timesheetCtrl', function($scope,$cordovaCalendar) { 

    $scope.calendarView = 'week'; 
    $scope.calendarDay = new Date(); 
    $scope.tester = 'Is the Controller connecting'; 
    $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 
    } 
]; 

}) 

視圖(的index.html)

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
    <title></title> 

    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
    <script src="lib/ionic/js/ionic.bundle.js"></script> 

    <!-- cordova script (this will be a 404 during development) --> 

    <script src="lib/ngCordova/dist/ng-cordova.js"></script> 


    <script src="cordova.js"></script> 

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above 
    <link href="css/ionic.app.css" rel="stylesheet"> 
    --> 

    <script src="js/app.js"></script> 
    <script src="js/controllers.js"></script> 
    <script src="js/routes.js"></script> 
    <script src="js/services.js"></script> 
    <script src="js/directives.js"></script> 
    <script src="lib/angular-moment/angular-moment.js"></script> 
    <link href="lib/angular-bootstrap-calendar/dist/css/angular-bootstrap-calendar.min.css" rel="stylesheet"> 

    <script src="lib/ui-bootstrap-tpls-1.2.2.min.js"></script> 
     <script src="lib/angular-bootstrap-calendar/dist/js/angular-bootstrap-calendar-tpls.min.js"></script> 

    <!-- Only required for Tab projects w/ pages in multiple tabs 
    <script src="lib/ionicuirouter/ionicUIRouter.js"></script> 
    --> 

    </head> 
    <body ng-app="app" animation="slide-left-right-ios7"> 
    <div> 
    <div> 
     <ion-nav-bar class="bar-stable"> 
      <ion-nav-back-button class="button-icon icon ion-ios-arrow-back">Back</ion-nav-back-button> 
     </ion-nav-bar> 
     <ion-nav-view></ion-nav-view> 
    </div> 
</div> 
    </body> 
</html> 

Timesheet.html:

<ion-view title="Timesheet"> 
    <ion-content overflow-scroll="true" padding="true" class="has-header"> 
    {{tester}} 
     <mwl-calendar 
    view="calendarView" 
    view-date="calendarDate" 
    events="events" 
    view-title="calendarTitle" 
    on-event-click="eventClicked(calendarEvent)" 
    on-event-times-changed="calendarEvent.startsAt = calendarNewEventStart; calendarEvent.endsAt = calendarNewEventEnd" 
    edit-event-html="'<i class=\'glyphicon glyphicon-pencil\'></i>'" 
    delete-event-html="'<i class=\'glyphicon glyphicon-remove\'></i>'" 
    on-edit-event-click="eventEdited(calendarEvent)" 
    on-delete-event-click="eventDeleted(calendarEvent)" 
    cell-is-open="true"> 
</mwl-calendar> 
    </ion-content> 
</ion-view> 

有人知道這個問題的解決?

enter image description here

回答

1

我可以告訴你我看到的一見鍾情。如果您正在使用基於moment.js構建的角矩,則還需要包含該文件。

<script src="lib/moment/moment.js"></script> 
<script src="lib/angular-moment/angular-moment.js"></script> 

查看角度時刻的官方文檔,一切都在那裏解釋。祝你好運 !