La question est de savoir comment formater un JavaScript en Date
tant que chaîne indiquant le temps écoulé de la même manière que vous voyez les temps affichés sur Stack Overflow.
par exemple
- il y a 1 minute
- Il ya 1 heure
- il y a 1 jour
- Il ya 1 mois
- il y a 1 an
javascript
date-formatting
Sky Sanders
la source
la source
Intl.RelativeTimeFormat.prototype.format()
.Réponses:
la source
Cela peut être exagéré dans ce cas, mais si l'occasion se présente, moment.js est tout simplement génial!
Moment.js est une bibliothèque datetime javascript, pour l'utiliser pour un tel scénario, vous feriez:
http://momentjs.com/docs/#/displaying/fromnow/
Addendum 2018 : Luxon est une nouvelle bibliothèque moderne et pourrait valoir le coup d'œil!
la source
Je n'ai pas vérifié (bien que ce ne soit pas difficile), mais je pense que les sites Stack Exchange utilisent le
jquery.timeago
plugin pour créer ces chaînes de temps .Il est assez facile d'utiliser le plugin, il est propre et se met à jour automatiquement.
Voici un exemple rapide (de la page d'accueil du plugin):
la source
Cela vous montrera les formats d'heure passés et précédents comme 'il y a 2 jours' 'dans 10 minutes' et vous pouvez lui passer soit un objet Date, un horodatage numérique ou une chaîne de date
la source
return time;
parformat = time_formats[time_formats.length - 1]; return Math.floor(seconds / format[2]) + ' ' + format[1] + ' ' + token;
pour renvoyer des siècles pendant de longues périodes au lieu des millisecondes.Voici une légère modification de la solution de Sky Sander qui permet de saisir la date sous forme de chaîne et est capable d'afficher des plages telles que "1 minute" au lieu de "73 secondes"
la source
interval = Math.floor(seconds / 60);
. J'ai ajoutéinterval = seconds;
dans la finaleelse
et ça marche bien.let seconds = Math.floor((+new Date() - date) / 1000);
interval === 0
le dernierif
?Vous voudrez peut-être regarder humanized_time_span: https://github.com/layam/js_humanized_time_span
C'est un cadre indépendant et entièrement personnalisable.
Il suffit de télécharger / inclure le script et vous pouvez alors faire ceci:
ou même ceci:
Lisez les documents pour plus d'informations.
la source
NaN years ago
pourquoi ??humanized_time_span("2011/05/11 12:00:00")
Changé la fonction ci-dessus en
Sinon, cela montrerait des choses comme "75 minutes" (entre 1 et 2 heures). Il suppose également maintenant que la date d'entrée est un horodatage Unix.
la source
Code très lisible et compatible avec tous les navigateurs:
Tel que donné par @Travis
la source
Une version plus courte utilisée par Lokely :
la source
Infinity seconds ago
à partir de maintenant, param horodatage unix,
la source
Une version ES6 du code fourni par @ user1012181
Édité avec des suggestions @ ibe-vanmeenen. (Merci !)
la source
Version simple et lisible:
la source
J'en écris un avec js et python, utilisé dans deux projets, très agréable et simple: une simple bibliothèque (moins de 2 Ko) utilisée pour formater la date avec la
*** time ago
déclaration.simple, petit, facile à utiliser et bien testé.
npm install timeago.js
import timeago from 'timeago.js'; // or use script tag
utilisez l'api
format
.Échantillon:
Vous pouvez également effectuer un rendu en temps réel.
la source
import { format, render, cancel, register } from 'timeago.js';
Bien que la question ait été posée il y a assez longtemps, écrire cette réponse avec espoir aidera quelqu'un.
Passez la date à partir de laquelle vous souhaitez commencer à compter. Utilisation
moment().fromNow()
de momentjs : (Voir plus d'informations ici )Si vous souhaitez modifier les informations fournies pour les dates à partir de Maintenant, vous écrivez votre heure relative personnalisée pour le moment.
Par exemple, dans mon propre cas, je voulais imprimer
'one month ago'
au lieu de'a month ago'
( fourni par moment (d) .fromNow () ). Dans ce cas, vous pouvez écrire quelque chose ci-dessous.REMARQUE : j'ai écrit mon code de projet dans Agular 6
la source
Peut également utiliser le plugin dayjs relativeTime pour résoudre ce problème.
la source
Cela devrait gérer correctement tout horodatage valide, y compris Date.now (), les unités singulières et les dates futures. J'ai omis des mois, mais ceux-ci devraient être faciles à ajouter. J'ai essayé de le garder aussi lisible que possible.
la source
J'ai modifié la version de Sky Sanders. Les opérations Math.floor (...) sont évaluées dans le bloc if
la source
return days + "1 day ago";
devrait êtrereturn "1 day ago";
la source
la source
Ma solution ..
la source
Mon coup de poignard à cela basé sur d'autres réponses.
la source
Je cherchais une réponse à cela et j'ai presque mis en œuvre l'une de ces solutions, mais un collègue m'a rappelé de vérifier la
react-intl
bibliothèque car nous l'utilisions déjà.Donc, en ajoutant aux solutions ... dans le cas où vous utilisez la
react-intl
bibliothèque, ils ont un<FormattedRelative>
composant pour cela.https://github.com/yahoo/react-intl/wiki/Components#formattedrelative
la source
Voici ce que j'ai fait (l'objet renvoie l'unité de temps avec sa valeur):
la source