来自 md-datepicker 的值的日期格式答案

【问题标题】：Date format of value from md-datepicker来自 md-datepicker 的值的日期格式
【发布时间】：2016-01-08 16:34:57
【问题描述】：

如何以特定格式格式化md-datepicker 的模型变量。我尝试了$mdDateLocaleProvider的配置，但它只是格式化了日期选择器的显示值，而不是模型值。请查看此codepen 或以下代码：

HTML：

<div ng-app="MyApp" ng-controller="AppCtrl">
  <md-content>
    <md-datepicker ng-model="myDate" md-placeholder="Enter date"></md-datepicker>
  </md-content>
  <p>Date not formatted:</p>
  {{myDate}}
</div>

JS：

angular.module('MyApp')
    .controller('AppCtrl', function($scope) {
      $scope.myDate = new Date();
    })

.config(function($mdDateLocaleProvider) {
  $mdDateLocaleProvider.formatDate = function(date) {
    return moment(date).format('YYYY-MM-DD');
  };
});

【问题讨论】：

标签： javascript angularjs datepicker angular-material

【解决方案1】：

您应该使用角度“日期”过滤器

{{myDate | date:'yyyy-MM-dd'}}

有关更多格式和其他信息，请参阅：https://docs.angularjs.org/api/ng/filter/date

【讨论】：

好吧，其实我不想在 UI 中显示，我想将它发送到后端系统，所以如果我可以直接从一些格式相关的配置/选项中获取它。
据我所知，您遇到的问题是日期选择器提供的模型是 Date 对象，而不是格式化的字符串。您可以使用各种方法将该日期格式化为字符串并执行您需要的操作。如有必要，watch() 模型并将其格式化为新对象。

【解决方案2】：

var dateFormat = function(date) {

    var date = date.getDate();
    var month = date.getMonth();
    var year = date.getFullYear();
    var formattedDate = (date < 10 ?  ('0' + date) : date) + '/' + (month < 10 ?  ('0' + month) : month) + '/' + year;
}

或者

return date.getDate() + "/" +date.getMonth()+1 + "/" + date.getFullYear();

将给您 2016 年 1 月 8 日。（您需要 +1 getMonth() 因为一月是 0）。这是你要找的吗？

编辑：函数

【讨论】：

【解决方案3】：

模型对象始终是一个 javascript 日期对象，您只能在渲染它时更改表示形式（例如像您所做的那样使用时刻，或者已经提到的角度日期过滤器）。

也许您应该阅读 javascript 和 JSON 中的日期格式：The “right” JSON date format

但是，您可以在将日期对象发送到服务器/后端之前对其进行转换。如果您使用带有$resource 或$http 的REST，您可以使用angular-http-transform-date 之类的东西，或者通过将请求转换器添加到$httpProvider 来自行完成。有一个blog post 显示如何处理响应，但同样的机制适用于请求。

【讨论】：