javascript - chrome DateTime 控件的 AngularJS 数据绑定(bind)在更新 24.0.1312.52 后不起作用

Question

希望其他人也观察到这一点:-

我们正在使用 AngularJS 1.0 并使用 type="date"和元素来获得 Chrome 的默认日期时间选择器。一切正常，直到 chrome 最近更新为 [24.0.1312.52]。现在，如果我使用日期时间选择器更改日期，AngularJS 数据绑定(bind)不会保存它以绑定(bind) $scope 的 json 属性。

如果我通过按下任何键盘键更改日期，数据绑定(bind)会将日期保存到属性绑定(bind)中。

导致此问题的原因可能是什么？

Answer 1

我注意到了相同的行为，并注意到 Sutikshan 走在了正确的道路上。

HTML 5 input date要求值在 RF 3339 中格式，因此，我们可以调整 AngularJS input directive相应地格式化和解析值。

angular.module('myApp', []).directive('input', ['$filter',
function($filter) {
    return {
        require: '?ngModel',
        restrict: 'E',
        link: function(scope, element, attrs, ngModel) {
            if (!ngModel || attrs.type != "date") return;

            // Using AngularJS built in date filter, convert our date to RFC 3339
            ngModel.$formatters = [function(value) {
                return value && angular.isDate(value)
                    ? $filter('date')(value, 'yyyy-MM-dd')
                    : '';
            }];

            // Convert the string value to Date object.
            ngModel.$parsers = [function(value) {
                return value && angular.isString(value)
                    ? new Date(value)
                    : null;
            }];
        }
    };
}]);

基础是我们确保 NgModelController在更新 View 值和模型值时分别使用我们的 $formatters 和 $parsers。