材料 js 日期选择器和 ng-model 日期字符串不匹配答案

【问题标题】：material js date-picker and ng-model date string mismatch材料 js 日期选择器和 ng-model 日期字符串不匹配
【发布时间】：2018-02-02 13:55:38
【问题描述】：

我对 AngularJS ng-model 和 Angular Materia 日期选择器有一些疑问。我有两个问题。一是日期选择器输入中显示的日期与 ng-model 值不同。另一个是当用户在日历上选择日期时，ng-model 值与用户选择的日期不同。以下是详细信息。

所以我在控制器中有这个字符串变量 $scope.formData["begin_date"] = "2017-09-25"

这是我的html标签

<md-input-container >
    <label>Start date</label>
        <md-datepicker required ng-model="formData.begin_date"></md-datepicker>
        </md-input-container>

但这是我的浏览器显示的内容。我想在输入上显示的日期是 2017-09-25，但显示的是 2017-09-24。这是图像。 date displayed on the date picker input

而且我不明白如何解决此问题以显示我想要显示的确切日期。

另外，我希望用户能够使用日期选择器选择日期并查看在浏览器上选择的日期。但是，当用户选择日期时，绑定到日期选择器的 ng-model 会显示不同的日期。例如，用户在日历上选择2017-09-28，如下所示。 user picks 2017-09-28

但角度 ng-model 显示的日期值与用户从日历中选择的日期不同，如下所示。在网络浏览器上显示"2017-09-29T00:00:00.000Z"，我只想简单地显示2017-09-28

如何解决这两个问题？

非常感谢您的帮助。

【问题讨论】：

标签： angularjs datepicker material-design

【解决方案1】：

所以我在控制器中有这个字符串变量 $scope.formData["begin_date"] = "2017-09-25"

将begin_date 写为Date 对象：

$scope.formData = {
    begin_date: new Date("2017-09-25")
  };

DEMO CODEPEN

【讨论】：