Maison  >  Article  >  interface Web  >  Explication détaillée du filtre de formatage temporel angulaireJS

Explication détaillée du filtre de formatage temporel angulaireJS

小云云
小云云original
2018-03-07 15:39:251597parcourir

1. La fonction du filtre de date est de formater une date en chaîne en fonction du format requis.

Paramètres de base de la chaîne de format : cet article partage principalement avec vous l'explication détaillée du filtre de formatage temporel angulaireJS, j'espère qu'il pourra vous aider.

'yyyy' : utilisez 4 chiffres pour représenter l'année (par exemple : AD 1 => 0001, AD 2010 => 2010)

'yy' : utilisez 2 chiffres pour représenter l'année. année ( 00-99) (par exemple : AD 2001 => 01, AD 2010 => 10)

'y' : utilisez un chiffre pour représenter l'année (par exemple : AD 1 => 1, 199 après JC = > 199)

'MMMM' : Le nom anglais complet signifie janvier-décembre

'MMM' : L'abréviation anglaise signifie janvier-décembre

'MM' : Deux chiffres représentent le mois (01-12)

'M' : Mois (1-12)

'dd' : Deux chiffres représentent le jour (01-31)

'd' : jour (1-31)

'EEEE' : le nom anglais complet du jour de la semaine (dimanche-samedi)

'EEE' : l'abréviation anglaise de la semaine Le jour en (Dim-Sat)

'HH' : Deux chiffres représentent l'heure au format 24 heures (00-23)

'H' : L'heure au format 24 heures (0- 23)

'hh' : Deux chiffres indiquant l'heure du matin ou de l'après-midi (01-12)

'h' : L'heure de le matin ou l'après-midi (1-12)

'mm' : Deux chiffres représentent les minutes (00-59)

'm' : Minutes (0-59)

'ss' : deux chiffres représentent les secondes (00-59)

's' : secondes (0-59)

'sss' : millisecondes (000-999)

'a' : AM/PM

'Z' : 4 chiffres (+ signe) représentant le décalage horaire (-1200 - +1200)

'ww' : 2 chiffres représentant le numéro de semaine de l'année (00- 53), la première semaine (01) est le premier jeudi de l'année

'w' : le nombre de semaines de l'année (0-53), la première semaine (1) est le jour de l'année Premier jeudi

'G','GG','GGG' : abréviation de la chaîne d'ère, telle que 'AD' (A.D.)

' GGGG' : abréviation de la chaîne d'ère Nom complet, tel que 'Anno Domini' (AD)

Nous pouvons librement combiner les paramètres ci-dessus selon nos propres souhaits pour obtenir le format souhaité, tel que 'aaaa- MM-jj', etc.

La chaîne de format fournit également des formats localisés prédéfinis, qui nous conviennent facilement :

medium : 'MMM d,y h:mm:ss a' Par exemple : 3 septembre 2010 12:05:08 PM

short : 'M/d/yy h:mm a' Par exemple : 9/3/10 12:05 PM

fullDate : 'EEEE,MMMM d ,y' Par exemple : vendredi 3 septembre 2010

longDate : 'MMMM d,y' Par exemple : 3 septembre 2010

mediumDate : 'MMMM d,y' Par exemple : 3 septembre 2010

shortDate : 'M/d/y' Par exemple : 9/3/10

mediumTime : 'h:mm:ss a' Par exemple : 12h05 : 08 PM

shortTime : 'h:mm a' Par exemple : 12:05 PM

La chaîne de format peut contenir des valeurs de texte. Ceux-ci doivent être entourés de guillemets simples (par exemple "h 'le matin'"). Si vous souhaitez afficher une paire de guillemets simples, utilisez deux guillemets doubles dans une séquence (par exemple "h 'o''clock'").

Utilisation du filtre de date :

1. Utilisation en html : {{ date_expression | date : format : timezone}}

Exemple :

<span>{{1288323623006 | date:&#39;medium&#39;}}</span><br>
 <span>{{1288323623006 | date:&#39;yyyy-MM-dd HH:mm:ss Z&#39;}}</span><br>
<span>{{&#39;1288323623006&#39; | date:&#39;MM/dd/yyyy @ h:mma&#39;}}</span><br>
<span>{{&#39;1288323623006&#39; | date:"MM/dd/yyyy &#39;at&#39; h:mma"}}</span><br>

Le résultat de sortie est :

29 octobre 2010 11:40:23

2010-10-29 11:40:23 +0800

10/29/ 2010 à 11h40

29/10/2010 à 11h40

2. Utilisation en javascript : $filter('date')(date, format, fuseau horaire)

Exemple :

var aujourd'hui = new Date();
$scope.formatDate = $filter('date')(aujourd'hui, 'aaaa-MM-jj');

Le résultat de sortie est :

28/01/2015

2.

Le filtre de date d'angularJS peut formater la date dans le format requis.

Méthodes couramment utilisées : 43a48aaf141a3b3be20c8194f84c8b0b
{{now | date : 'aaaa-MM-jj HH:mm:ss' } >

Si aucun format n'est spécifié, angulaireJS utilisera le format par défaut mediumDate

{{data | date}}<!-- Dec 3, 2016  -->
{{data | date : mediumDate}}<!-- Dec 3, 2016  -->

Ce qui suit est le formatage de date intégré d'angularJS

{{ now | date:&#39;medium&#39; }}<!-- Dec 3, 2016 10:43:51 AM -->
{{ now | date:&#39;short&#39; }}<!-- 12/3/16 10:43 AM -->
{{ now | date:&#39;fullDate&#39; }}<!-- Saturday, December 3, 2016 -->
{{ now | date:&#39;longDate&#39; }}<!-- December 3, 2016 -->
{{ now | date:&#39;mediumDate&#39; }}<!-- Dec 3, 2016 -->
{{ now | date:&#39;shortDate&#39; }}<!-- 12/3/16 -->
{{ now | date:&#39;mediumTime&#39; }}<!-- 10:43:51 AM -->
{{ now | date:&#39;shortTime&#39; }}<!-- 10:43 AM -->

Formatage de l'année
Année à quatre chiffres : {{ maintenant | date : 'aaaa' }} 21f8b90508180e8fb6c080fc31eb23a9
Année à deux chiffres : {{ maintenant | date : 'aa' }} 301ab69c48343e0c405282031c1ea155
Année à un chiffre : {{ maintenant | date : 'y' }} 21f8b90508180e8fb6c080fc31eb23a9

Format du mois
Mois en anglais : {{ now | date:'MMMM' }} 928ddab24b2d75ea33a9ee22998349d4
Abréviation du mois en anglais : {{ now date:'MMM' } } effa84c4dbed9a1587593a4dc2ac5781
Mois numérique : {{ now |date:'MM' }} 2485a18c88644944777fda07f87a161f
Nombre de mois dans l'année : {{ maintenant |date : 'M' }} 4c4a46cfde2f32a7b32ea7bb883d65b4

Format de la date
Date numérique : {{ now | date:'dd' }} fb57134e626c7331c2e72ea2d47d026e
Jour du mois : {{ now | } 7018c17e6fabdfb00cdfc5baec81ca3f
Semaine anglaise : {{ now | date:'EEEE' }} fbebb420dd6a368f4f5ed87e0058b9a0
Abréviation de la semaine anglaise : { { now date | :'EEE' }} 694c7c0c808b8707a7670d54492c8339

Formatage de l'heure
Heure numérique sur 24 heures : {{now | date:'HH'}} < ;!-- 10 -->
Heure du jour : {{now | date :'H'}} 0af5e8bb4e7476410a8d01b8470a60c5
Heure numérique au format 12 heures : {{now date : 'hh'}} 9cb30901740ebee1bfd96717de66ab5f
L'heure du matin ou de l'après-midi : {{now | date:'h'}} c9589930325425b693dd9bb409763548
Formatage des minutes
Minute numérique : {{ now | date:'mm' }} 3f50c37f5e79b9e967dd43855c4e17c2
Minute de l'heure : { { now | date:'m' }} a5a4a3467807e3fb9d9e0c746ea5ab6f
Formatage des secondes
Secondes numériques : {{ now | date:'ss' }} 278220e7656d1bc229bf0cdc1e0b18e9
Le nombre de secondes dans une minute : {{ now | date:'s' }} 278220e7656d1bc229bf0cdc1e0b18e9
Le nombre de millisecondes : {{ now | date:' .sss' }} 9efc32b73260e7dffbbc0ad19236beaf
Formatage des caractères
Identifiant AM et PM : {{ now | date:'a' }} b973c95d3a8f6f5df43821fbcacf1d96
Format personnalisé
{{ maintenant | date:'MMMd, y ' }} cbf444086742e14eb911c43a81dae798
{{ maintenant | date:'EEEE, d, M' }} d8864fda46884c2488d1af01fea3d834
{{ maintenant | date:'hh:mm:ss .sss' }} cd9f541f15df5d0ef8d0e67a6922b774

Recommandations associées :

Explication détaillée du filtre Angularjs pour implémenter un exemple de fonction de tri

Introduction détaillée du filtre Angular js

Explication détaillée du filtre Angularjs pour implémenter la fonction de recherche et de tri dynamique

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn