How can I solve the timezone problem using an Angular 4 date tube?

I have a date value in each of my objects that I can print as follows:

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

And here is what it looks like:

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

To change the format to make it more readable, I use the Angular date protocol:

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

Using this result:

30/05/1931

As you can see, it displays the previous day (May 30, not May 31).

As far as I understand, the problem is related to the time zone, since I'm in Argentina, and we have GMT-3, then 00:00 the 31st minute 3 hours will be May 30 at 9 pm.

So, how can I get this to take the time literally, and not process it based on the time zone, but still apply the format in the pipe?

+26
source share
4

DatePipe . :

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

, (new Date()).getTimezoneOffset()

/ DatePipe. . ({{ 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 Docs: https://angular.io/api/common/DatePipe

+25

angular 5 , pipe,

.

, , GMT-2, : '-120'

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

, angular 4.0

  <p>Or if you prefer, {{today | date:'dd/MM/yyyy'}}</p>

@angular/common DatePipe

LIVE DEMO

0

I also ran into the same problem. Before saving data, convert the date format to the one used in the service. For example, in my case in Java, it was "YYYY-MM-DD." Therefore, before saving all the data at an angle: where the date of birth is tied to the field of your template or simply displayed.

this.birthdate = this.datePipe.transform (birthDate, 'yyyy-MM-dd'); where the date of birth is not a date object, but a string date.

Now that you need to show the date the user interface was used:

                let dd = (new Date(data.birthDate)).getUTCDate().toString();

                let mm = ((new Date(data.birthDate)).getMonth()).toString();
                let yy = (new Date(data.birthDate)).getFullYear().toString();

                this.birthDate = new Date(Number(yy), Number(mm), Number(dd));
0
source

All Articles