小编rso*_*bon的帖子

我正在使用Angular UI Bootstrap Datepicker:https://angular-ui.github.io/bootstrap/#/datepicker

当我使用从服务器接收的数据呈现表单时,datetime字段存在问题.我的输入日期选择器如下所示:

<form name="itemForm">
    <input type="datetime" class="form-control" id="startedAt" name="startedAt"
           ng-model="item.startedAt"
           ng-click="open($event, 'startedAt')"
           uib-datepicker-popup="yyyy-MM-dd"
           is-open="datepickers.startedAt"
    />
</form>

我的服务器将响应日期时间作为JSON字符串返回:

{    
   ...
   startedAt: "2015-05-29T02:00:00+0200"
}

当我将响应数据分配给模型时$scope.item = response;,会正确呈现datepicker输入字段(选择正确的日期并按照我选择的格式正确格式化).问题是验证没有通过.我明白了:

itemForm.startedAt.$invalid == true

我注意到绑定到datepicker字段的数据应该是Date对象而不是字符串(当我从datepicker中选择新日期时,$scope.item.startedAt是一个Date)

我设法解决了这个问题并在控制器中执行此操作:

$scope.item = response;
$scope.item.startedAt = new Date($scope.item.startedAt);

它以这种方式工作......但我不希望每次从服务器获得响应时手动转换字符串do日期.我试图创建一个指令,我可以将其分配给datepicker输入字段,以便它ng-model为我转换:

.directive("asDate", function () {
    return {
        require: 'ngModel',
        link: function (scope, element, attrs, modelCtrl) {

            modelCtrl.$formatters.push(function (input) {

                var transformedInput = new Date(input);

                if (transformedInput != input) …