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

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 :
{{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' }}
Année à deux chiffres : {{ maintenant | date : 'aa' }}
Année à un chiffre : {{ maintenant | date : 'y' }}

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

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

Formatage de l'heure
Heure numérique sur 24 heures : {{now | date:'HH'}} < ;!-- 10 -->
Heure du jour : {{now | date :'H'}}
Heure numérique au format 12 heures : {{now date : 'hh'}}
L'heure du matin ou de l'après-midi : {{now | date:'h'}}
Formatage des minutes
Minute numérique : {{ now | date:'mm' }}
Minute de l'heure : { { now | date:'m' }} < !-- 43 -->
Formatage des secondes
Secondes numériques : {{ now | date:'ss' }}
Le nombre de secondes dans une minute : {{ now | date:'s' }}
Le nombre de millisecondes : {{ now | date:' .sss' }}
Format personnalisé
{{ maintenant | date:'MMMd, y ' }}
{{ maintenant | date:'hh:mm:ss .sss' }}

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!