Angular.js Date/Time Picker

Angular Core Dependency: latest

Module License: MIT

Added by: Sam Deering





Stars: 296

Watchers: 296

Forks: 155


Alon Gubkin
Alon Gubkin

Module Description


Warning: This project is no longer maintained. Use at your own risk!

The mobile-friendly, responsive, and lightweight Angular.js date & time input picker. Perfect for Ionic apps!

datepicker, datepicker

This is basically a pickadate.js fork that completely removes the jQuery dependency and adds Angular.js directives.


bower install angular-native-picker


Include build/angular-datepicker.js in your application:

<script src="angular-datepicker.js"></script>

Add the module angular-datepicker as a dependency to your app module:

var myapp = angular.module('myapp', ['angular-datepicker']);

To create a date or time picker, add the pick-a-date or pick-a-time directive to your input tag:

<input type="text" pick-a-date="date" placeholder="Select Date" /> {{ date }}
<input type="text" pick-a-time="time" placeholder="Select Time" /> {{ time }}

You can also provide an options object to the directive which will be passed into the pickadate or pickatime constructor.

// somewhere in your controller
$scope.options = {
  format: 'yyyy-mm-dd', // ISO formatted date
  onClose: function(e) {
    // do something when the picker closes   
<input type="text" pick-a-date="date" pick-a-date-options="options" /> {{ date }}
<input type="text" pick-a-time="time" pick-a-time-options="options" /> {{ time }}

If you don't need to provide any callbacks (like onClose) you can specify the options object as an angular expression:

<input type="text" pick-a-date="date" pick-a-date-options="{ format: 'yyyy-mm-dd' }" />

For a full list of available options please refer to the pickadate documentation for datepicker options and timepicker options.

Module stats last updated: 2017-02-20 15:00:02

Disclaimer: Some data on this page may have been gathered from the authors GitHub respository. If you see any mistakes or outdated information please let us know. Thanks!