md-datepicker必須是Date實例錯誤

Question

我這里有問題。 我想以模態形式使用Angular Material datepicker。 我只是將它添加到我的表單中

<md-datepicker ng-model="new.warranty" md-placeholder="Enter date"></md-datepicker>

如果我提交表格，我得到了這個：

Sun Apr 03 2016 00:00:00 GMT+0300 (EEST)

但是我希望在發送之前以yyyy-MM-dd格式轉換數據，所以我試圖以這種方式轉換日期格式

data.warranty = $filter('date')(Date.parse(data.warranty), 'yyyy-MM-dd');

所以我的表格發送了一個必需的yyyy-MM-dd格式，但每當我匯總表格時我都會收到錯誤。

`The ng-model for md-datepicker must be a Date instance. Currently the model is a: string`

那么，如果可能的話，我怎么能在不使用moment.js的情況下防止這個錯誤。

Answer 1

在data.warranty上使用$filter('date')時，將它從Date對象轉換為String ，從而產生錯誤。

選項1

解決此問題的最快方法是將日期值復制為字符串：

<md-datepicker ng-model="new.warrantyDate" md-placeholder="Enter date"></md-datepicker>

每當您提交表單時，在提出請求之前，請以您需要的格式轉換日期， 但不要覆蓋現有日期 ：

data.warranty = $filter('date')(Date.parse(data.warrantyDate), 'yyyy-MM-dd');

因此，您的warrantyDate值將保留為Date對象並將繼續工作。 如果您在響應中修改日期，請不要忘記將warrantyDate與修改日期同步。

選項2

您可以嘗試的另一個選項是創建一個指令，該指令將為您的data.warranty變量提供不同的$modelValue和$viewValue 。 有關如何實現此目的的更多信息，請參閱ngModelController上的文檔 。

第二個選項需要更深入地了解角度是如何工作的，所以如果你處於angularjs路徑的最開始，你可能會選擇第一個選項。

Answer 2

我已經通過覆蓋md-datepicke解決了這個問題，這是代碼

 .directive('mdDatepicker', function ($parse) {

    return {
        require: 'ngModel',
        link: function (scope, elem, attr, ngModel) {
            $parse(attr.ngModel).assign(scope, new Date(_.get(scope, attr.ngModel)));
        }
    }
})