2015-05-29 59 views
42

我的工作angular應用與Djangorest-framework ..錯誤:[ngModel:datefmt]預期`2015-05-29T19:06:16.693209Z`是一個日期 - 角

的應用程序接收它的信息與服務器json。其中一個密鑰是created_time ...該字段的值是格式根據iso-8601,例如2015-05-29T19:06:16.693209Z

在客戶端我有一個字段:

<input type="time" ng-model="created_time"> 

但是當數據到達我得到這個錯誤:

Error: [ngModel:datefmt] Expected `2015-05-29T19:06:16.693209Z` to be a date http://errors.angularjs.org/1.3.13/ngModel/datefmt?p0=2015-05-29T19%3A06%3A16.693209Z 
at REGEX_STRING_REGEXP (angular.js:63) 
at Array.<anonymous> (angular.js:19807) 
at Object.ngModelWatch (angular.js:23289) 
at Scope.$get.Scope.$digest (angular.js:14235) 
at Scope.$get.Scope.$apply (angular.js:14506) 
at done (angular.js:9659) 
at completeRequest (angular.js:9849) 
at XMLHttpRequest.requestLoaded (angular.js:9790) 

我已經試過各種方法:(格式是完全一樣的說明在角度的文檔...

回答

66

這必須發生在角度1.3 + 1.3+對病房ng-model的日期/時間輸入需要是一個有效的日期對象,字符串表示的d吃了不再是允許的。您需要將字符串轉換爲日期對象($scope.created_time = new Date(dateString))並將其綁定到ng模型。如果您按照error link的說明,它對錯誤以及如何解決錯誤有明確的描述。

All date-related inputs like require the model to be a Date object. If the model is something else, this error will be thrown. Angular does not set validation errors on the in this case as those errors are shown to the user, but the erroneous state was caused by incorrect application logic and not by the user.

+0

非常感謝你:) – Yehuda

+0

@Yehuda歡迎您! – PSL

+0

這隻適用於瀏覽器現在,但不適用於科爾多瓦 – niklas

33

如果您從REST服務獲取數據,則可以簡單地將字段轉換爲日期。

$http.get(url).success(function(data){ 
    $scope.data = data; // get row data 
    $scope.data.mydatefield = new Date($scope.data.mydatefield); // convert filed to date 
}); 
+1

這對我有幫助。謝謝:) – Sampath

+0

在$ resource.save回調中很好地工作 – jmaculate

-2

如果需要使用對象更新陣列的所有日期

var data = [ 
    { id: "1" , birthday: "2016-01-20T11:24:20.882Z"}, 
    { id: "2" , birthday: "2016-01-20T11:24:20.882Z"}, 
    { id: "3" , birthday: "2016-01-20T11:24:20.882Z"}, 
]; 

    function convertDataStingToObject (data) { 
    for(var i=0; i < data.length; i++){ 
     console.log('string: ' + data[i].birthday); 
     data[i].birthday = new Date(data[i].birthday); 
     console.log('updated: ' + data[i].birthday); 
     console.log(typeof(data[i].birthday)); 
    } 

    return data; 
    } 

convertDataStingToObject(data); 
+0

新Date()總是根據用戶區域設置返回日期,所以不是一個選項。如果我在服務器上保存了08.33,我想顯示8.33上午,而不是用戶所在的GMT偏移量 – Mirko

14

創建一個簡單的指令,轉換模型值:

HTML:

<input date-input type="time" ng-model="created_time"> 

指令:

app.directive('dateInput', function(){ 
    return { 
     restrict : 'A', 
     scope : { 
      ngModel : '=' 
     }, 
     link: function (scope) { 
      if (scope.ngModel) scope.ngModel = new Date(scope.ngModel); 
     } 
    } 
}); 
6

除了PSL的回答。 這是如何覆蓋角1.3+要求是一個日期對象。

<input type="date" ng-model="book.date" date-format/>

app.directive('dateFormat', function() { 
    return { 
    require: 'ngModel', 
    link: function(scope, element, attr, ngModelCtrl) { 
     //Angular 1.3 insert a formater that force to set model to date object, otherwise throw exception. 
     //Reset default angular formatters/parsers 
     ngModelCtrl.$formatters.length = 0; 
     ngModelCtrl.$parsers.length = 0; 
    } 
    }; 
}); 

它可以與AngularFire $ firebaseObject使用,正常工作與$ bindTo 3雙向綁定。無需擴展$ firebaseObject服務。它適用於離子/科爾多瓦應用。

Working example on jsfiddle

基於this answer

0

問題其實這是日期格式的問題,我已使用這段代碼解決了這個問題。 解決方案:下面的代碼將解決這個問題:

  var options = { 
       weekday: "long", year: "numeric", month: "short", 
       day: "numeric", hour: "2-digit", minute: "2-digit" 
      }; 
      $scope.created_time = $scope.created_time.toLocaleTimeString("en-us", options); 

其中EN-US格式=「星期五,2013年2月1日06:00 「,希望這會幫助別人解決問題,我正面臨着這樣的錯誤,並以此解決。

0

我有這個錯誤,我直接使用該對象:我張貼解決方案女巫我進行了:
1:$ userData.dob = new Date(userData.dob); 2:$ scope.edit.userdob = userData.dob; 之前1我面臨上述錯誤,然後我直接創建該對象,並將其分配到編輯範圍和問題得到解決。

0

如果日獲得1天減少,使用此代碼,

new Date(moment.utc(value).format('l LT'))