有没有办法将输入绑定到我的模型并在两者之间有一个日期过滤器

Question

在我的AngularJS应用程序中，有一个用户可以输入日期的字段：

<input data-ng-model="modal.data.published" />

提交并收到后，它将采用如下形式："2013-08-22T00:00Z" .请注意，它必须完全采用这种形式，其中"T00：00Z"在提交时附加到输入字段中的字符串上，并在数据从服务器传输到浏览器时删除。

有没有办法使日期绑定按如下方式工作：

Date Entered                  >>>>   Date sent to server
"2013-08-22"                         "2013-08-22T00:00Z"
Date sent from server         >>>>   Date appearing in the input field
"2013-08-22T00:00Z"                  "2013-08-22" 

Answer 1

ngModelController 为 ng-model 指令提供了 API：

• 使用 $formatters 设置模型 -> 视图中的值的格式。
• 使用 $parsers 格式化和验证视图 -> 模型中的值。

这是一个 plunker：

app.directive('niceDate', function($filter){
  return {
    require: "ngModel",
    link: function(scope,elm,attrs,ngModel){
      ngModel.$formatters.push(function(val){
        return $filter('date')(val,"yyyy-MM-dd");
      });
      ngModel.$parsers.push(function(val){
        return $filter('date')(val,"yyyy-MM-dd") + "T00:00Z";
      })
    }
  }
})

标记：

<input type="text" nice-date data-ng-model="modal.data.published" />

我刚刚展示了一个基本示例，您还应该添加自定义验证。