- Notifications
You must be signed in to change notification settings - Fork1
Datepicker for Angular Material, mimick's Android's date time picker
License
vlio20/angular-material-datetimepicker
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Originally designed for Bootstrap Material, this has been modified to work withAngular Material. This is an Android style date-time picker for Angular Material. Some added features include:
- Double click to select date or time
- Swipe left to go to next month or Swipe right to go to previous month.
** I have kept this section of the document as an acknowledgement for all the work done on the original Bootstrap Material plugin **
| Date | Author | Description |
|---|---|---|
| 2015-11-12 | logbon72 | Adapted plugin for Angular Material |
| 2015-10-19 | benletchford | Fixed not being able to tab into input |
| 2015-10-19 | drblue | Fixed erroneous package.json-file |
| 2015-10-19 | Perdona | Fix auto resize when month has 6 weeks |
| 2015-07-01 | T00rk | Redesigned element without using modal |
| 2015-06-16 | T00rk | Use Timepicker alone / Display short time (12 hours) |
| 2015-06-13 | T00rk | Fixed issue with HTML value tag |
| 2015-05-25 | T00rk | Changed repo name to bootstrap-material-datetimepicker * |
| 2015-05-12 | T00rk | Added parameters for button text |
| 2015-05-05 | Sovanna | FIX undefined _minDate in isBeforeMaxDate func |
| 2015-04-10 | T00rk | Little change in clock design |
| 2015-04-10 | Peterzen | Added bower and requirejs support |
| 2015-04-08 | T00rk | Fixed problem on locale switch |
| 2015-03-04 | T00rk | Added Time picker |
| (*) File names have been changed |
bootstrap-material-datepicker.js => bootstrap-material-datetimepicker.js
bootstrap-material-datepicker.css => bootstrap-material-datetimepicker.css
Depends on the following library:
- Angular Material & it's dependencies
- Angular Touch
- MomentJS
bower install angular-material-datetimepickerClickhere to see live examples.
Add the plugin module as a dependency to your AngularJS module:
angular.module('myAwesomeModule',[//other dependencies ignored'ngMaterialDatePicker']);
This plugin exposes a directive which should be used as an attribute for an input element. The directive ismdc-datetime-picker. An example of this is given below:
<md-input-containerflex-gt-md="30"><label>Timepicker Only</label><inputmdc-datetime-pickerdate="false"time="true"type="text"id="time"short-time="true"placeholder="Time"min-date="minDate"format="hh:mm a"ng-model="time"></md-input-container>
The directive accepts several attributes which are described below:
| Name | Type | Description |
|---|---|---|
| ng-model | (String|Date|Moment) | Initial Date or model to assign the date to |
| format | String | MomentJS Format,defaults toHH:mm for time picker only,YYYY-MM-DD for date picker only andYYYY-MM-DD HH:mm for both timepicker and date picker |
| short-time | Boolean | true => Display 12 hours AM|PM |
| min-date | (String|Date|Moment) | Minimum selectable date |
| max-date | (String|Date|Moment) | Maximum selectable date |
| date | Boolean | true => Has Datepicker (default: true) |
| time | Boolean | true => Has Timepicker (default: true) |
| cancel-text | String | Text for the cancel button (default: Cancel) |
| ok-text | String | Text for the OK button (default: OK) |
| on-change | Function | Callback which will be executed when the date will be applied (example:on-change="onChange($dateTime)")$dateTime will be a moment object |
About
Datepicker for Angular Material, mimick's Android's date time picker
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
Languages
- JavaScript50.6%
- HTML33.4%
- CSS13.1%
- PHP2.9%