Angular Datetime Demo Page

Reset Clear

To use the directive, add datetime="date-format" attribute to your input.

<input type="text" datetime="yyyy-MM-dd HH:mm:ss" ng-model="myDate">

Min / Max

Validation for min/max date. The min/max attribute will be used to construct the date object.

<input type="text" datetime="yyyy-MM-dd HH:mm:ss" ng-model="myDate" min="Jan 1, 2010" max="Dec 31, 2019">

Required

You won't be able to clear this field if required. You can still set the model value to null though.

<input type="text" datetime="yyyy-MM-dd HH:mm:ss" ng-model="myDate" required>

Model format

You can use a date string instead of date object as model value.

myDate = {{myDate.model | json}}

<input type="text" datetime="medium" datetime-model="yyyy-MM-dd HH:mm:ss" ng-model="myDate">

Localizable formats

The parser supports localizable formats in angular.

Other tests