angularJS 時間フォーマットフィルターの詳細な説明

.date フィルターの機能は、必要な形式に基づいて日付を文字列にフォーマットすることです。

書式文字列の基本パラメータ: この記事では主に angularJS 時間書式フィルターの詳細な説明を共有します。お役に立てれば幸いです。

'yyyy': 年を表すのに 4 桁を使用します (例: AD 1 => 0001、AD 2010 => 2010)

'yy': 年を表すのに 2 桁を使用します (00-99) (例: : AD 2001 => 01、AD 2010 => 10)

'y': 年を表す 1 桁を使用します (例: AD 1 => 1、AD 199 => 199)

'MMMM ': 完全な英語名 月 (1 月～12 月) を意味します

'MMM': 英語の略語は月 (1 月～12 月) を意味します

'MM': 2 桁の数字は月 (01-12) を意味します

'M': 月 ( 1-12)

'dd': 日を表す 2 桁 (01-31)

'd': 日 (1-31)

'EEEE': 曜日の完全な英語名 (日曜日) -土曜日)

'EEE ': 曜日の英語の略語 (Sun-Sat)

'HH': 時間を 24 時間形式で表す 2 桁 (00-23)

'H' : 24 時間形式の時間 (0 ～ 23)

'hh': 2 桁の数字は午前または午後の時間を表します (01 ～ 12)

'h': 午前または午後の時間 (1 -12)

'mm': 分を表す 2 桁 (00-59)

'm': 分 (0-59)

'ss': 秒を表す 2 桁 (00-59)

's ': 秒 (0-59)

'sss': ミリ秒 (000-999)

'a': AM/PM

'Z': 4 桁 (+ 符号) はタイムゾーン オフセット (-1200— —+1200)

'ww': 2 桁で表現 1 年の週数 (00 ～ 53)、最初の週 (01) は年の最初の木曜日です

'w': 週数年 (0 ～ 53) の最初の週 (1) は、年の最初の木曜日です

'G','GG','GGG': 'AD' (AD など) の時代文字列の省略形)

'GGGG': 'Anno Domini' (AD) などの時代文字列の完全な名前

必要に応じて上記のパラメータを自由に組み合わせて、'yyyy- などの必要な形式を取得できます。 MM-dd' など

フォーマット文字列には、使用すると便利な事前定義されたローカライズされたフォーマットもいくつか用意されています:

medium: 'MMM d,y h:mm:ss a' 例: Sep 3, 2010 12:05:08 PM

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

fullDate: 'EEEE,MMMM d,y' 例: 2010 年 9 月 3 日金曜日

longDate: 「MMMM d,y」 例: 2010 年 9 月 3 日

mediumDate: 'MMM d,y' 例: 2010 年 9 月 3 日

shortDate: 'M/d/y' 例: 9/3/10

mediumTime: ' h:mm:ss a' 例: 12:05:08 PM

shortTime: 'h:mm a' 例: 12:05 PM

書式指定文字列にはテキスト値を含めることができます。これらは一重引用符で囲む必要があります (例: "h 'in the breakfast'")。一対の単一引用符を出力する場合は、2 つの二重引用符を連続して使用します (例: "h 'o''lock'")。

日付フィルターの使用法:

1. HTML での使用法: {{ date_expression | date : format : timezone}}

例:

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

出力結果は次のようになります:

Oct 29, 2010 11:40:23 AM

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

10/29/2010 @ 11:40AM

10/29/2010 at 11:40AM

2. JavaScript での使用法: $filter('date ' )(日付、形式、タイムゾーン)

例:

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

出力結果は次のとおりです:

2015-01-28

2.

angularJS の日付フィルターは日付を必要な形式にフォーマットできます。

一般的に使用される方法:
{{now | date : 'yyyy-MM-dd HH:mm:ss'}}

そうでない場合指定された形式では、angularJS はデフォルト形式の mediaDate を使用します

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

以下は、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 -->

年の形式
4 桁の年: {{ now | date:'yyyy' }} < ;!-- 2016 -->
2 桁の年: {{ now | date:'yy' }}
1 桁の年: {{ now | date:'y ' }}

月の形式
英語の月: {{ now | date:'MMMM' }}
英語の月の省略形: {{ now | date:'MM' }}
数値月: {{ now |date:'MM' }}
年: {{ 現在 |date:'M' }}

日付の書式設定
数値日付: {{ now | date:'dd' }}
日付: {{ now | date:'d' }} < ;!-- 3 -->
英語の平日: {{ now | date:'EEEE' }}
英語の平日の略語: {{ now | date:'EEEE' }}

時間の書式設定
24 時間デジタル時間: {{now | date:'HH'}}
その日の数字 時間: {{now | date:'HH'}} date:'H'}}
12 時間デジタル時間: {{now | date:'hh'}}
分の書式設定
数値分: {{now | date:'mm' }}
秒の数値: {{ now | date:'ss' }}
1 分の秒数: {{ now | date:'s' }}
文字の書式設定
Up および PM 識別子: {{ now | date:'a' }}
4 桁のタイムゾーン識別子: {{ 今 | 日付:'Z' }}
カスタム形式
{{ 現在 | 日付: 'MMd, y' }}

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AIヘンタイを無料で生成します。

もっと見る

人気の記事

R.E.P.O.説明されたエネルギー結晶と彼らが何をするか（黄色のクリスタル）

3週間前 By 尊渡假赌尊渡假赌尊渡假赌

R.E.P.O.最高のグラフィック設定

3週間前 By 尊渡假赌尊渡假赌尊渡假赌

アサシンのクリードシャドウズ：シーシェルリドルソリューション

1週間前 By DDD

R.E.P.O.誰も聞こえない場合はオーディオを修正する方法

3週間前 By 尊渡假赌尊渡假赌尊渡假赌

Atomfallのクレーンコントロールキーカードを見つける場所

1週間前 By DDD

もっと見る

ホットツール

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

もっと見る

ホットトピック

Gmailメールのログイン入り口はどこですか？

7442

15

CakePHP チュートリアル

1371

52

Steamのアカウント名の形式は何ですか

76

11

Win11 Activation Key Permanent

36

19

NYTの接続はヒントと回答です

7

6

もっと見る