web-dev-qa-db-ja.com

Angular 4日付パイプでタイムゾーンの問題に対処するにはどうすればよいですか？

各オブジェクトには、次のように印刷できる日付値があります。

<td> {{competition.compStart }}</td>

そして、これがどのように見えるかです：

1931-05-31T00:00:00.000+0000

形式を変更して読みやすくするために、Angular日付パイプを使用しています。

<td> {{competition.compStart | date : "dd/MM/yyyy"}}</td>

この結果で：

30/05/1931

ご覧のとおり、前日（5月31日ではなく5月30日）が表示されています。

私の知る限り、問題はタイムゾーンに関連しています。私はアルゼンチンにいて、GMT-3を持っているので、31日の3時から3時間を引いた3時は5月30日の午後9時になります。

それでは、タイムゾーンに基づいて処理するのではなく、文字通り時間をかけて、パイプの形式を適用するにはどうすればよいですか？

angulardate-pipe
26
Matias Diez

舞台裏では、DatePipeはロケールを使用してユーザーのタイムゾーンで日付を表示します。 クライアントのタイムゾーンデータで試してください：

1931-05-31T00:00:00.000-0300の代わりに1931-05-31T00:00:00.000+0000。

(new Date()).getTimezoneOffset()を使用して、クライアントのオフセットを数分で取得できます

これは、実際にはDatePipeの既知の問題/制限です。コミュニティはそれを認識しています。将来的には、パラメーターの1つとしてタイムゾーンを指定できるようになります（{{ value | date:format:zone }}）。

Githubの問題は次のとおりです。 https://github.com/angular/angular/issues/9324

より高度な日付操作については、moment.js（頭痛の軽減、一貫性の向上、テストの削減、保守の簡素化）をお勧めします。

編集：追加されました：

date_expression | date[:format[:timezone[:locale]]]

コード： https://github.com/angular/angular/blob/5.0.4/packages/common/src/pipes/date_pipe.ts#L137 ドキュメント： https：// angular.io/api/common/DatePipe

24
rzelek

angular 5以上の場合、パイプにタイムゾーンを追加してみてください。

デフォルトでは、ユーザーマシンのローカルタイムゾーンが使用されます

また、例えばGMT-2、タイムゾーン： '-120'の場合、分単位で指定できます

{{ competition.compStart | date: 'short' : '-120'}}
4
Fateh Mohamed