Format date with timezone in angularjs

Question

Using angularjs 1.2.26 i cant format my date input to the desired timezone, here's an example: http://plnkr.co/edit/CxCqoR3Awcl1NFrCZYjx?p=preview

{{'2015-07-10T12:37:08Z' | date : "MMMM d, y 'at' h:mma Z" : 'America/Bahia'}}

and

{{'2015-07-10T12:37:08Z' | date : "MMMM d, y 'at' h:mma Z" : 'Europe/Paris'}}

gave the same output respecting my browser's local timezone and ignoring the timezone i've set.

Answer 1

There are two problems:

• The time zone support looks like it was introduced post-1.2.26

• The time zone support doesn't take an arbitrary TZDB ID. From the docs for v1.4.1:

  Timezone to be used for formatting. It understands UTC/GMT and the continental US time zone abbreviations, but for general use, use a time zone offset, for example, '+0430' (4 hours, 30 minutes east of the Greenwich meridian) If not specified, the timezone of the browser will be used.

  In v1.3.16 it's even more restricted:

  Timezone to be used for formatting. Right now, only 'UTC' is supported. If not specified, the timezone of the browser will be used.

So if you change your example to use:

<script data-require="[email protected]" src="https://code.angularjs.org/1.4.2/angular.js" data-semver="1.4.2"></script>

and then:

<span>{{'2015-07-10T12:37:08' | date : "MMMM d, y 'at' h:mma Z" : 'PST'}}</span>
<br/>
<span>{{'2015-07-10T12:37:08' | date : "MMMM d, y 'at' h:mma Z" : 'EDT'}}</span>

(for example) then you'll get output of:

July 10, 2015 at 3:37AM -0800 
July 10, 2015 at 7:37AM -0400