Javascript Girl
  1. Javascript Girl
  3. Javascript ne convertit pas la date angulaire de date de l'édition ui en UTC correctement
Intereting Posts
Comment réparer des briques qui se chevauchent avec Angular + Maçonnerie? Comment ajouter du texte à '<textarea>'? Java peut-il écouter "onDomChange" sur tous les éléments Dom? Détecter si l'élément a arrêté le défilement de momentum? Comment détecter si une fonction est appelée constructeur? Propager l'opérateur vs Object.assign Convertissez 12 heure hh: mm AM / PM à 24 heures hh: mm Est-il possible de classer un titre? (Et avec CSS ou js?) Le script ajouté de manière dynamique ne sera pas exécuté Javascript string replace & lt; Dans < Comment puis-je vérifier les tableaux JavaScript pour les chaînes vides? Utilisation de la variable _ (soulignement) avec des fonctions de flèche dans ES6 / Typescript Définir un CSS préfixé par fournisseur en utilisant javascript Comment le bouton du navigateur Web Spotify interagit-il avec l'application Spotify? ReferenceError: $ n'est pas défini

Javascript ne convertit pas la date angulaire de date de l'édition ui en UTC correctement

J'utilise angi ui datepicker dans mon projet (asp.net web api + angularjs). Tout fonctionne bien, mais quand j'essaie d'enregistrer la date à Db, il ne le convertit pas correctement au format UTC et les sous-unités 1 jour (en quelques heures, mais cela affecte aussi un jour).

Par exemple, lorsque je choisis 01/11/2014 dans le journaliste: 

Angularjs object: Sat Nov 01 2014 00:00:00 GMT+0200 (FLE Standard Time) In request: 2014-10-31T22:00:00.000Z In asp.net api controller: {31-Oct-14 10:00:00 PM}

Contrôleur DatePicker: 

 app.controller('DatepickerCtrl', function ($scope) { $scope.today = function () { $scope.dt = new Date(); }; $scope.today(); $scope.clear = function () { $scope.dt = null; }; $scope.open = function ($event) { $event.preventDefault(); $event.stopPropagation(); $scope.opened = true; }; $scope.format = 'dd/MM/yyyy'; $scope.dateOptions = { 'starting-day': 1 }; });

Hnml: 

 <div class="form-group inputGroupContainer" ng-controller="DatepickerCtrl"> <label for="date">Date of Birth</label> <p class="input-group"> <input type="text" name="date1" ui-date="{dateFormat: 'yy-mm-dd'}" ui-date-format="yy-mm-dd" placeholder="DD/MM/YYYY" class="form-control" datepicker-popup="{{format}}" ng-model="user.Personal.BirthDate" max-date="currentDate" is-open="opened" close-text="Close" /> <span class="input-group-btn"> <button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button> </span> </p> </div>

Mais il semble que le datepicker angulaire mette en surbrillance la date correcte:

Entrez la description de l'image ici

J'ai essayé de convertir manuellement la date en format UTC mais aussi sans succès 

  toUTCDate: function (d) { var date = new Date(d); var _utc = new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate());//, date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds() return _utc; }

Devrais-je spécifier le fuseau horaire ou utiliser un filtre angulaire js? J'apprécierai toute aide!

J'ai eu exactement le même problème, la solution était de supprimer le composant fuseau horaire de la partie date. Pour résoudre le problème d'une manière plus générique, j'avais écrit une directive 

 csapp.directive("csDateToIso", function () { var linkFunction = function (scope, element, attrs, ngModelCtrl) { ngModelCtrl.$parsers.push(function (datepickerValue) { return moment(datepickerValue).format("YYYY-MM-DD"); }); }; return { restrict: "A", require: "ngModel", link: linkFunction }; });

La directive ci-dessus supprime la partie fuseau horaire et considère seulement la date partie de l'entrée du format de date ISO.

J'utilise moment.js pour les manipulations de date. Mais vous pouvez facilement convertir ci-dessus pour ne pas utiliser moment.js

MODIFIER

Utilisez-le comme ci-dessous 

  <input ng-model='abc' cs-date-to-iso ui-datepicker>

Juste pour ajouter la version coffeescript de la réponse d'Entre, qui fonctionne pour moi en "angular": "~1.3.14", 

 app.directive 'dateToIso', [ () -> restrict: 'A', require: 'ngModel' link: (scope, el, attrs, ngModel) -> if (angular.isUndefined(attrs.ngModel)) console.log 'ngModel attribute missing for date-to-iso' else ngModel.$parsers.push (datePickerValue) -> return moment(datePickerValue).format("YYYY-MM-DD") ]

N'envoyez pas l'objet javascript dans la requête json, javascript ajoute le fuseau horaire des navigateurs dans la représentation de chaîne de l'objet utilisé dans JSON. Vous pouvez utiliser quelque chose comme ceci pour extraire la date dans une chaîne sans le fuseau horaire: 

 myApp.service('dateService', function(){ this.parse = function(date) { if(!date){ return "" } var day = (date.getDate() < 10 ? '0' : '') + date.getDate(); var month = ((date.getMonth() + 1) < 10 ? '0' : '') + (date.getMonth() + 1); var hours = (date.getHours() < 10 ? '0' : '') + date.getHours(); var minutes = (date.getMinutes() < 10 ? '0' : '') + date.getMinutes(); var seconds = (date.getSeconds() < 10 ? '0' : '') + date.getSeconds(); return date.getFullYear() + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds } });

Ensuite, dans votre backend, il suffit d'analyser la chaîne dans un objet de date en utilisant le format "aaaa-MM-dd HH: mm: ss" dans le fuseau horaire de votre choix. Je ne connais pas .NET mais chez java, vous pouvez faire quelque chose comme ceci: 

 def jsCalendarFormat = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss") jsCalendarFormat.setTimeZone(user.timezone) Date dateObj = jsCalendarFormat.parse(date)