javascript - AngularJS - 无法在 View 中显示日期对象

Question

我试图在我的 View 中显示一个日期对象。

我遵循了这些文档:https://docs.angularjs.org/api/ng/input/input%5Bdate%5D

但没有成功。

我确实有相同的代码:(编辑:删除了 controllerAs 语法并添加了 $scope)

<input type="date" name="birthDate" ng-model="example.value"
   placeholder="yyyy-MM-dd" min="2013-01-01" max="2013-12-31" required /> 

和我的对象:

$scope.example = {
     value: new Date(2013, 9, 22)
};

但是还是报错

Error: [ngModel:datefmt] Expected 2013-10-22 to be a date

有谁知道是什么导致了这个问题？我尝试在线查看，但我找到的所有答案都说日期对象无效，我很确定我的不是。 (或者是？？)

编辑:

由于很多人无法理解我的问题所在，让我用一个 jsfiddle 来说明:http://jsfiddle.net/j2kof5at/

在输出中我看到“dd-mm-2013”​​而不是“22-10-2014”。这是为什么？

编辑 2:(解决方案)

我尝试的解决方案之一是将 angular-input-date 模块添加到我的项目中。我刚刚从我的项目中删除了它，似乎问题已解决。阅读我发现的这个模块的文档:

The latest stable version of AngularJS (~1.2.26) has no support for input[type="date"]. The support was added only for 1.3 branch of Angular, which is now in beta.

因为我使用的是 angular 1.5.x，所以已经有了对此的原生支持，而这个模块实际上是导致问题的原因。这也解释了为什么我的 jsfddle 不工作，因为它使用的是 angular 1.0.1

Answer 1

angModule.directive('moDateInput', function ($window) {
    return {
        require:'^ngModel',
        restrict:'A',
        link:function (scope, elm, attrs, ctrl) {
            var moment = $window.moment;
            var dateFormat = attrs.moDateInput;
            attrs.$observe('moDateInput', function (newValue) {
                if (dateFormat == newValue || !ctrl.$modelValue) return;
                dateFormat = newValue;
                ctrl.$modelValue = new Date(ctrl.$setViewValue);
            });

            ctrl.$formatters.unshift(function (modelValue) {
                if (!dateFormat || !modelValue) return "";
                var retVal = moment(modelValue).format(dateFormat);
                return retVal;
            });

            ctrl.$parsers.unshift(function (viewValue) {
                var date = moment(viewValue, dateFormat);
                return (date && date.isValid() && date.year() > 1950 ) ? date.toDate() : "";
            });
        }
    };
});