Heim >Web-Frontend >js-Tutorial >Detaillierte Erläuterung des AngularJS-Zeitformatierungsfilters

Detaillierte Erläuterung des AngularJS-Zeitformatierungsfilters

小云云
小云云Original
2018-03-07 15:39:251663Durchsuche

1. Die Funktion des Datumsfilters besteht darin, ein Datum basierend auf dem erforderlichen Format in eine Zeichenfolge zu formatieren.

Grundlegende Parameter der Formatzeichenfolge: Dieser Artikel teilt Ihnen hauptsächlich die detaillierte Erklärung des AngularJS-Zeitformatierungsfilters mit. Ich hoffe, er kann Ihnen helfen.

'yyyy': Verwenden Sie 4 Ziffern, um das Jahr darzustellen (zum Beispiel: AD 1 => 0001, AD 2010 => 2010)

'yy': Verwenden Sie 2 Ziffern, um das Jahr darzustellen Jahr ( 00-99) (zum Beispiel: AD 2001 => 01, AD 2010 => 10)

'y': Verwenden Sie eine Ziffer, um das Jahr darzustellen (zum Beispiel: AD 1 => 1, 199 n. Chr. = > 199)

'MMMM': Der vollständige englische Name bedeutet Januar-Dezember

'MMM': Die englische Abkürzung bedeutet Januar-Dez

'MM': Zwei Ziffern repräsentieren den Monat (01-12)

'M': Monat (1-12)

'dd': Zwei Ziffern repräsentieren den Tag (01-31)

'd': Tag (1-31)

'EEEE': der vollständige englische Name des Wochentags (Sonntag-Samstag)

'EEE' : die englische Abkürzung der Woche Der Tag in (Sonn-Sa)

'HH': Zwei Ziffern repräsentieren die Stunde im 24-Stunden-Format (00-23)

'H': Die Stunde im 24-Stunden-Format (0-23)

'hh': Zwei Ziffern, die die Stunde des Morgens oder Nachmittags angeben (01-12)

'h': Die Stunde von am Morgen oder Nachmittag (1-12)

'mm': Zwei Ziffern stellen Minuten dar (00-59)

'm': Minuten (0-59)

'ss': Zwei Ziffern stellen Sekunden dar (00-59)

's': Sekunden (0-59)

'sss': Millisekunden (000-999)

'a': AM/PM

'Z': 4 Ziffern (+ Vorzeichen) für den Zeitzonenversatz (-1200 - +1200)

'ww': 2 Ziffern für den Wochennummer des Jahres (00-53), die erste Woche (01) ist der erste Donnerstag des Jahres

'w': die Anzahl der Wochen des Jahres (0-53), die erste Woche (1) ist der Tag des Jahres. Erster Donnerstag

'G','GG','GGG': Abkürzung der Ära-Zeichenfolge, z. B. 'AD' (A.D.)

' GGGG': Abkürzung der Ära-Zeichenfolge Vollständiger Name, z. B. 'Anno Domini' (AD)

Wir können die oben genannten Parameter nach unseren eigenen Wünschen frei kombinieren, um das gewünschte Format zu erhalten, z. B. 'yyyy- MM-tt' usw.

Die Formatzeichenfolge stellt auch einige vordefinierte lokalisierte Formate bereit, die für uns praktisch sind:

Medium: 'MMM d,y h:mm:ss a' Zum Beispiel: 3. September 2010 12:05:08 Uhr

kurz: 'M/d/jj h:mm a' Zum Beispiel: 03.09.10 12:05 Uhr

vollständiges Datum: 'EEEE,MMMM d ,y' Zum Beispiel: Freitag, 3. September 2010

longDate: 'MMMM d,y' Zum Beispiel: 3. September 2010

mediumDate: 'MMMM d,y' Zum Beispiel: 3. September 2010

shortDate: 'M/d/y' Zum Beispiel: 03.09.10

mediumTime: 'h:mm:ss a' Zum Beispiel: 12:05: 20 Uhr

shortTime: 'h:mm a' Zum Beispiel: 12:05 Uhr

Die Formatzeichenfolge kann Textwerte enthalten. Diese müssen in einfache Anführungszeichen gesetzt werden (z. B. „h 'am Morgen'“). Wenn Sie ein Paar einfache Anführungszeichen ausgeben möchten, verwenden Sie zwei doppelte Anführungszeichen in einer Folge (z. B. „h 'o''clock'“).

Verwendung des Datumsfilters:

1. Verwendung in HTML: {{ date_expression | date : format : timezone}}

Beispiel:

<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>

Das Ausgabeergebnis ist:

29. Okt. 2010 11:40:23 Uhr

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

10/29/ 2010 um 11:40 Uhr

29.10.2010 um 11:40 Uhr

2. Verwendung in Javascript: $filter('date')(date, format, timezone)

Beispiel:

var today = new Date();
$scope.formatDate = $filter('date')(today, 'yyyy-MM-dd');

Das Ausgabeergebnis ist:

28.01.2015

2.

Der Datumsfilter von AngularJS kann das Datum in das erforderliche Format formatieren.

Häufig verwendete Methoden: b6f4550932131e3fb738d6351cf5327b
{{jetzt |. } }

Wenn kein Format angegeben ist, verwendet AngularJS das Standardformat mediumDate

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

Das Folgende ist die integrierte Datumsformatierung von 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 -->

Jahresformatierung
Vierstelliges Jahr: {{ now | date:'yyyy' }} 21f8b90508180e8fb6c080fc31eb23a9
Zweistelliges Jahr: {{. jetzt |. Datum:'yy' }} 301ab69c48343e0c405282031c1ea155
Einstelliges Jahr: {{ jetzt |. Datum:'y' }} 21f8b90508180e8fb6c080fc31eb23a9

Monatsformat
Englischer Monat: {{ now |. date:'MMMM' }} 4cd13505ed211177b94b054f9d8809b8
Englische Monatsabkürzung: {{ now |. } effa84c4dbed9a1587593a4dc2ac5781
Numerischer Monat: {{ now |date:'MM' }} 2485a18c88644944777fda07f87a161f
Anzahl der Monate im Jahr: {{ jetzt |Datum:' M' }} 2485a18c88644944777fda07f87a161f

Datumsformatierung
Numerisches Datum: {{ jetzt |. Datum: 'dd' }} 9801ade335e8996c05c79bdcdb82ed99
Tag des Monats: {{ jetzt |. } e7e62d5f97460753606b5fde4974d6a0
Englische Woche: {{ jetzt |. Datum:'EEEE' }} 513b3b8f0d02bbb78bda9a06f929da7a
Englische Woche-Abkürzung: { { jetzt | :'EEE' }} 95ca91ce7c2b0d8cbc927d6677678991

Stundenformatierung
24-Stunden-numerische Stunde: {{now |. Datum:'HH'}} < ;!-- 10 -->
Stunde des Tages: {{now |. Datum:'H'}} 292f637d1ac700e7fecb86f3cb405aa8
Numerische Stunde im 12-Stunden-Format: {{jetzt |. 'hh'}} 9cb30901740ebee1bfd96717de66ab5f
Die Stunde am Morgen oder Nachmittag: {{now | date:'h'}} c9589930325425b693dd9bb409763548
Minutenformatierung
Numerische Minute: {{ now |. date:'mm' }} 7a8efe97822350462eeffeef20fe0281
Minute der Stunde: { { now |. date:'m' }} !-- 43 -->
Sekundenformatierung
Numerische Sekunden: {{ now |. date:'ss' }} 278220e7656d1bc229bf0cdc1e0b18e9
Die Anzahl der Sekunden in einer Minute : {{ now |. date:'s' }} 278220e7656d1bc229bf0cdc1e0b18e9
Die Anzahl der Millisekunden: {{ now |. date:' .sss' }} 9efc32b73260e7dffbbc0ad19236beaf
Zeichenformatierung
AM- und PM-Kennung: {{ jetzt |. Datum:'a' }} ac7b749a0a2dabca89012b5aad13dada
Benutzerdefiniertes Format
{{ now | date:'MMMd, y ' }} d72b01e3e202ee90d7b83cc8e533916b
{{ jetzt |. Datum:'EEEE, d, M' }} 4ba8f4480f49bd4dbe12a82037018ce5
{{ jetzt | .sss' }} cd9f541f15df5d0ef8d0e67a6922b774

Verwandte Empfehlungen:

Detaillierte Erläuterung der Angularjs-Filter zur Implementierung von Beispielen für Sortierfunktionen

Detaillierte Einführung in Angularjs-Filter

Detaillierte Erläuterung der Angularjs-Filter zur Implementierung dynamischer Such- und Sortierfunktionen

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des AngularJS-Zeitformatierungsfilters. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn