J'ai une valeur de date dans chacun de mes objets que je peux imprimer comme ceci:
<td> {{competition.compStart }}</td>
Et voici à quoi ça ressemble:
1931-05-31T00:00:00.000+0000
Afin de changer le format pour le rendre plus lisible, j'utilise le tube de date angulaire:
<td> {{competition.compStart | date : "dd/MM/yyyy"}}</td>
Avec ce résultat:
30/05/1931
Comme vous pouvez le constater, il affiche le jour précédent (le 30 mai au lieu du 31 mai).
Autant que je sache, le problème est lié au fuseau horaire, puisque je suis en Argentine et que nous avons l'heure GMT-3, puis minuit moins le 31 moins 3 heures seraient le 30 mai à 21 heures.
Alors, comment puis-je prendre le temps à la lettre et ne pas le traiter en fonction du fuseau horaire, tout en appliquant le format dans le tuyau?
En coulisse, DatePipe
utilise les paramètres régionaux pour afficher la date dans le fuseau horaire de l'utilisateur. Essayez avec les données de fuseau horaire du client:
1931-05-31T00:00:00.000-0300
au lieu de 1931-05-31T00:00:00.000+0000
.
Vous pouvez obtenir le décalage du client en minutes en utilisant (new Date()).getTimezoneOffset()
C’est en fait le problème/la limite connue de DatePipe
. La communauté en est consciente. Dans le futur, vous pourrez spécifier le fuseau horaire comme l’un des paramètres ({{ value | date:format:zone }}
).
Voici le numéro sur github: https://github.com/angular/angular/issues/9324
Pour des manipulations de date plus avancées, je recommande moment.js
(moins de maux de tête, meilleure cohérence, moins de tests, une maintenance plus simple).
EDIT: Il a été ajouté:
date_expression | date[:format[:timezone[:locale]]]
Code: https://github.com/angular/angular/blob/5.0.4/packages/common/src/pipes/date_pipe.ts#L137 Documents: https: // angulaire. io/api/common/DatePipe
pour un angle supérieur ou égal à 5, essayez d’ajouter un fuseau horaire dans le tuyau,
Par défaut, le fuseau horaire local de la machine utilisateur est utilisé
et vous pouvez le spécifier en minutes, par exemple pour GMT-2, fuseau horaire: '-120'
{{ competition.compStart | date: 'short' : '-120'}}