developer tip

오류 : [ngModel : datefmt]`2015-05-29T19 : 06 : 16.693209Z`가 날짜가 될 것으로 예상 됨-Angular

optionbox 2021. 1. 10. 17:07
반응형

오류 : [ngModel : datefmt]`2015-05-29T19 : 06 : 16.693209Z`가 날짜가 될 것으로 예상 됨-Angular


내가 일하고 있어요 angular와 응용 프로그램 Django과 함께 rest-framework..

응용 프로그램은 서버에서 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)

나는 이미 모든 것을 시도했습니다 :( 형식은 angular 문서의 지침과 정확히 일치합니다 ...


이것은 각도 1.3+에서 발생해야합니다. 1.3+ on wards ng-model for date / time input은 유효한 날짜 개체 여야하며 날짜의 문자열 표현은 더 이상 허용되지 않습니다. 문자열을 날짜 객체 ( $scope.created_time = new Date(dateString)) 로 변환 하고 ng-model에 바인딩해야합니다. 오류 링크 를 따라 가면 오류에 대한 명확한 설명과 해결 방법이 있습니다.

같은 모든 날짜 관련 입력은 모델이 Date 객체 여야합니다. 모델이 다른 경우이 오류가 발생합니다. Angular는 이러한 오류가 사용자에게 표시되므로이 경우에 유효성 검사 오류를 설정하지 않지만 잘못된 상태는 사용자가 아닌 잘못된 응용 프로그램 논리로 인해 발생했습니다.


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
});

모델 값을 변환하는 간단한 지시문을 만듭니다.

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);
        }
    }
});

PSL의 답변 외에도. 이것은 Date 객체가되도록 각도 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 서비스를 확장 할 필요가 없습니다. Ionic / cordova 애플리케이션에서 작동합니다.

jsfiddle의 작업 예제

이 답변을 바탕으로


문제 사실 이것은 날짜 형식 문제입니다.이 코드를 사용하여이 문제를 해결했습니다. 솔루션 : 아래 코드로이 문제를 해결할 수 있습니다.

            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 형식 = "Friday, Feb 1, 2013 06 : 00 AM", 이것이 다른 사람들이 문제를 해결하는 데 도움이되기를 바라며, 이러한 오류에 직면하여이 문제를 해결했습니다.


I had this error and i directly used the object: I am posting the solution witch i carried out:
1:$userData.dob=new Date(userData.dob); 2:$scope.edit.userdob=userData.dob; before 1 i faced above error then i directly created the object and assigned it to the edit scope and the problem got resolved.


if date get reduced by 1 day, use this code,

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

If you need to update all dates in Array with Objects

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);

ReferenceURL : https://stackoverflow.com/questions/30537886/error-ngmodeldatefmt-expected-2015-05-29t190616-693209z-to-be-a-date-a

반응형