自定義日曆與引導和momentjs

我需要創建自定義日曆，我不要求在這裏完整的代碼解決方案，但我想只有當有人可以給我一些指導我應該如何處理這個問題，以及如何正確做到這一點。我將有用戶列表，並且每個用戶都有幾個有開始和結束日期的事件，我需要在日曆中顯示它，如this。貝婁，你可以看到我的用戶對象與事件列表，我不知道如何對象，我可以顯示在我的自定義日曆。我知道有很多日曆插件，但我無法找到任何看起來像我在該鏈接中顯示的日曆，所以這就是爲什麼我必須用angularjs，momentjs和引導表編寫我自己的原因。自定義日曆與引導和momentjs

{ 
    FirstName:Luis, 
    Last Name:Figo, 
    events:[ 
     { 
     startDate:01-01-2017, 
     endDate:01-05-2017, 
     eventName:Training session 
     }, 
     { 
     startDate:01-15-2017, 
     endDate:01-25-2017, 
     eventName:Training Session 
     } 
    ] 
}

來源

2017-03-01 Super Mario' s Yoshi

-1

for html file 

    <!DOCTYPE html> 
    <html> 
    <head> 
     <title>Angular Bootstrap Datepicker Demo</title> 
     <link rel="stylesheet" href="bootstrap/css/bootstrap.css" /> 
     <link rel="stylesheet" href="angular-bootstrap-datepicker.css" /> 
    <script src="jquery.js"></script> 
     <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
     <script src="angular.js"></script> 
     <script src="angular-bootstrap-datepicker.js" charset="utf-8"></script> 
     <script type="application/javascript"> 





    <body data-ng-app="demo"> 
     <div> 
      <div data-ng-controller="AppCtrl"> 
       <input id="datepicker" type="text" data-ng-datepicker data-ng-options="datepickerOptions" data-ng-model="date"> 

      </div> 
     </div> 
    app = angular.module('demo', ['ng-bootstrap-datepicker']); 
      app.controller('AppCtrl', function($scope) { 
       $scope.datepickerOptions = { 
        format: 'yyyy-mm-dd', 
        language: 'fr', 
        startDate: "2012-10-01", 
        endDate: "2012-10-31", 
        autoclose: true, 
        weekStart: 0 
       } 
      }); 
     </script> 
    </body> 
    </head> 
    </html> 

for .js file 

app = angular.module('demo', ['ng-bootstrap-datepicker']); 
     app.controller('AppCtrl', function($scope) { 
      $scope.datepickerOptions = { 
       format: 'yyyy-mm-dd', 
       language: 'fr', 
       startDate: "2012-10-01", 
       endDate: "2012-10-31", 
       autoclose: true, 
       weekStart: 0 
      } 
     }); 




for more info follow my calender app for referance https://github.com/mehulkumar1/datepicker

來源

2017-03-01 11:29:44

先生，我相信這不是我要找的。 –

自定義日曆與引導和momentjs

回答

相關問題