NgModel not updating when using input type date
I'm not sure if this is a bug or not, but here is what I am trying to accomplish. I only care about Google Chrome as this is for debugging purposes. I want to use html5 type input date and update the model. The problem is that if I select a date from the angular popup it doesn't update it. If instead I use arrows to execute dates, it then updates it. Is there any other way to update the ngModel?
<div ng-app>
<input type="date" data-ng-model="date" style="width:200px;" />
<br>
{{ date }}
</div>
Here is the script: http://jsfiddle.net/rtCP3/55/
source to share
Angular is listening for an event input
that seems to fire on mouse up / down click or click errors. For some reason (error?) This event is not fired from the calendar dialog.
I created a simple directive that registers with an event change
and then updates the model. You can see a working example here .
The directive is pretty simple:
module.directive('dateFix', function() {
return {
restrict: 'A',
require: 'ngModel',
link: function (scope, element, attr, ngModel) {
element.on('change', function() {
scope.$apply(function () {
ngModel.$setViewValue(element.val());
});
});
}
};
});
And then use it like this: <input type="date" ng-model="dateValue" date-fix />
A temporary workaround at least.
source to share