dateTime-local does not bind properly

Question

I am trying to bind an attribute of my model to a dateTime-local input and something is not working properly.

This is my model

$scope.testDate = new Date($.now());

This is my html

<input type="datetime-local" id="exampleInput" name="input" ng-model="testDate" />
value = {{testDate}}

When i start the app the dateTime input shows "mm/dd/yyyy, --:--:--" in the input box, but the "value =" part is displayed with the correct dateTime value.

If i enter a valid date in the input box it will update the value so the binding is working but something with displaying the initial value is not...

What am i missing here?

The input `type="datetime-local"` accept string value, not the real Date object. — runTarm, Aug 11 '14 at 11:50
I am using 1.2.16 since this is what i got from yeoman\bower :) Will look into changing the version and update. Thanks. — user860067, Aug 11 '14 at 12:36
Here is the complete reference for the usage of date time. Have look at this link might help. all the best [LINK](http://angulartutorial.blogspot.in/2014/04/date-filtering-and-formatting-in.html) — Sudarshan Kalebere, Aug 11 '14 at 12:06

score 8 · Accepted Answer · answered Aug 11 '14 at 12:09

8

AngularJS support the input type datetime-local since version 1.3.0-beta.1

And it is a breaking change that the value in model must be an Date object instead of string like in the previous version.

Therefore, if you would like to use the datetime-local input and bind it with Date object, please ensure to use angularjs version 1.3.0-beta.1 or newer.

answered Aug 11 '14 at 12:09

runTarm

11,537
1
37
37

Awesome! Thank you. That did the trick. Next time i will pay closer attention to the doc version :) – user860067 Aug 11 '14 at 12:59
@user860067 Yeah, especially for angularjs, it's changing fast and introduce a lot of breaking changes along the way. – runTarm Aug 11 '14 at 13:02

score 0 · Answer 2 · answered Jul 15 '16 at 05:55

  init the values   
 $scope.dateRange = {
    from : new Date(2010, 11, 28, 14, 57),
    to : new Date(2010, 11, 28, 14, 57)
  }   
then access 
alert($scope.dateRange.from);
alert($scope.dateRange.to);

Range From
 <input type="datetime-local" name="rangeFrom" ng-model="dateRange.from" >
 To
 <input type="datetime-local" name="rangeTo" ng-model="dateRange.to" >

dateTime-local does not bind properly

2 Answers2