web-dev-qa-db-fra.com

Erreur: [ngModel: datefmt] Date prévue - 2015-05-29T19: 06: 16.693209Z` - Angular

Je travaille sur angularapplication avec Django avec rest-framework ..

L'application reçoit ses informations avec JSON du serveur .. Une des clés est created_time... La valeur de ce champ est au format selon iso-8601, par exemple 2015-05-29T19:06:16.693209Z.

Dans le client, j'ai un champ: 

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

Mais quand les données arrivent, j'obtiens cette erreur: 

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)

J'ai déjà tout essayé :( le format est exactement comme les instructions dans la documentation de angular ...

javascriptangularjsdjangodjango-rest-framework
51
Yehuda

Cela doit se produire avec un angulaire 1.3+. 1.3+ sur wards-model pour l'entrée date/heure doit être un objet date valide, la représentation sous forme de chaîne de la date n'est plus autorisée. Vous devez convertir la chaîne en objet date ($scope.created_time = new Date(dateString)) et la lier au modèle ng. Si vous suivez le lien error il contient une description claire de l’erreur et de la façon de la résoudre.

Toutes les entrées liées à la date, par exemple, exigent que le modèle soit un objet Date. Si le modèle est autre chose, cette erreur sera renvoyée. Angular ne définit pas d'erreurs de validation dans ce cas car ces erreurs sont montrées à l'utilisateur, mais l'état erroné a été provoqué par une logique d'application incorrecte et non par l'utilisateur.

78
PSL

Si vous obtenez vos données d’un service REST, vous pouvez simplement convertir vos champs en Date.

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

Créez une directive simple qui convertit la valeur du modèle: 

HTML: 

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

Directif:

app.directive('dateInput', function(){
    return {
        restrict : 'A',
        scope : {
            ngModel : '='
        },
        link: function (scope) {
            if (scope.ngModel) scope.ngModel = new Date(scope.ngModel);
        }
    }
});
15
Rodolfo Jorge Nemer Nogueira

En plus de la réponse de PSL, voici comment remplacer les exigences angulaires 1.3+ en tant qu'objet Date.

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

Il peut être utilisé avec AngularFire $ firebaseObject et fonctionne parfaitement avec la liaison à 3 voies $ bindTo Pas besoin d'étendre le service $ firebaseObject. Cela fonctionne dans les applications ioniques/cordova.

Exemple de travail sur jsfiddle

Basé sur cette réponse

8
Andrey Klochkov

si la date est réduite de 1 jour, utilisez ce code,

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

J'ai eu cette erreur et j'ai directement utilisé l'objet: je poste la solution que j'ai réalisée:
1: $ userData.dob = new Date (userData.dob); 2: $ scope.edit.userdob = userData.dob; avant que je ne fasse face à l'erreur ci-dessus, j'ai directement créé l'objet et l'a affecté à la portée d'édition et le problème a été résolu.

0
Eknath Kulkarni

Problème Il s’agit en fait d’un problème de format de date, j’ai résolu ce problème en utilisant ce code . Solution: Le code ci-dessous résoudra ce problème:

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

où en-us format = "vendredi 1 févr. 2013 06:00", espérons que cela aidera les autres à résoudre le problème, je faisais face à une telle erreur et je le résolvais.

0
Usman