angular-bootstrap-datepicker - AngularJS directives for the bootstrap-datepicker
At the moment, only the "Component" type is supported.
Here's a working jsfiddle A more dynamic demo of all the options is available for the original bootstrap-datepicker.
Installation is easy, jQuery, AngularJS and Bootstrap's JS/CSS are required.
You can download angular-bootstrap-datepicker via bower:
bower install https://github.com/rbatllet/angular-bootstrap-datepicker.git
When you are done downloading all the dependencies and project files the only remaining part is to add dependencies as an AngularJS module:
angular.module('myModule', ['ng-bootstrap-datepicker']);You also need to include these files:
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="bower_components/angular-bootstrap-datepicker/dist/angular-bootstrap-datepicker.css" />
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-bootstrap-datepicker/dist/angular-bootstrap-datepicker.js" charset="utf-8"></script>Make sure you use charset="utf-8" in your script tag if your browser (or those of your users) is displaying characters wrong when using another language.
To use the directive, use the following code :
<input type="text" data-ng-datepicker data-options="datepickerOptions" data-ng-model="date">ng-datepicker : Indicates you want your input as a date picker.
ng-options : Object of the controller scope containing the options for your date picker.
ng-model : Variable of the controller scope to store the date. The date is currently store as a string, formatted according to the one set in ng-options.
For a working example, see https://github.com/cletourneau/angular-bootstrap-datepicker/blob/master/example/demo.html