Skip to content

Instantly share code, notes, and snippets.

Forked from eugenekgn/datetimepickerDirective.js
Last active May 1, 2019 14:03
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save mwadams/3a950170ec0636fa1036 to your computer and use it in GitHub Desktop.
Save mwadams/3a950170ec0636fa1036 to your computer and use it in GitHub Desktop.
'use strict';
.module('datetimepicker', [])
.provider('datetimepicker', function () {
var default_options = {};
this.setOptions = function (options) {
default_options = options;
this.$get = function () {
return {
getOptions: function () {
return default_options;
.directive('datetimepicker', [
function ($timeout,
datetimepicker) {
var default_options = datetimepicker.getOptions();
return {
require: '?ngModel',
restrict: 'AE',
scope: {
datetimepickerOptions: '@'
link: function ($scope, $element, $attrs, controller) {
var passed_in_options = $scope.$eval($attrs.datetimepickerOptions);
var options = jQuery.extend({}, default_options, passed_in_options);
$element.on('dp.change', function (ev) {
$timeout(function () {
var dtp = $"DateTimePicker");
function setPickerValue() {
var result = null;
if (!!controller && !!controller.$viewValue) {
result = controller.$viewValue;
var dtp = $"DateTimePicker");;
controller.$render = function (value) {
Copy link

ghost commented Apr 27, 2015

I'm getting TypeError: $element.datetimepicker is not a function at line 59,

I do have an $element var, so angular is finding it on the dom, the function just isn't attached.


it appears loaded in my index.html

Copy link

atais commented Oct 16, 2015

Great solution, why dont you pull request to

Copy link

Thanks! This is the only directive I've found that accepts two-way binding. Works Great!

Copy link

Thanks for the efforts with this. Perhaps I've misunderstood something but if you change the format to MM/YYYY it displays correctly but the variable contains a full time stamp. My testing shows, for instance, when I set the picker to August 2016 the display shows 08/2016 correctly but the ng-model value contains 2016-07-31T23:00:00.000Z" which does not match the picked value.

Have attempted to fix myself but being a bit of an Anuglar newb I'm struggling. If anyone has any thoughts they'd be greatly received!

Copy link

Got it. I think...


Copy link

Thanks! Works Great!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment