My model is based off of a JSON object and the date comes in as 2012-12-13T00:00:00-07:00
I want to use the date picker ui-date.
I have the following code that works.
<input ng-model="course.startDate" value="{{item.startDate | date: 'MM/dd/yyyy'}}" ui-date ng-required="true">
However,I don't think I should be using the value="{{item.startDate | date: 'MM/dd/yyyy'}}"
part but without it the input doesn't load with the value from the model.
The model is bound and functions correctly when I chose a date, it just shows up empty when the page loads.
What is the correct way to initialize this input?
Using ui-date
and ng-model
should be enough:
<div ng-controller="MyCtrl">
<input ng-model="date" ui-date>
</div>
Provided that the MyCtrl
is defined like this:
function MyCtrl($scope) {
$scope.date= new Date();
}
Here is a jsFiddle: http://jsfiddle.net/MvGFF/2/
What you must know is that the ui-date
expects model value to be an instance of Date, maybe you are passing a string (or other type) value?
If your model holds values that are strings and you still want to use a date-picker you need to add the ui-date-format
directive like in this example:
<input ng-model="date" ui-date ui-date-format>
where the controller is defined like so:
function MyCtrl($scope) {
$scope.date= "2012-12-13T00:00:00-07:00";
}
Here is a jsFiddle: http://jsfiddle.net/d4xz2/1/
This works fine :
<input type="text" ng-model="nota.fechaPub" value="{{nota.fechaPub}}" ui-date ui-date-format>
where $scope.nota.fechaPub value is "2013-01-14T23:00:00.000Z"
The value that appears in the text box is "01/15/2013"