自定义日历与引导和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

回答

相关问题