How to get hours and minutes in desired timezone without creating new moment object?

Question

I have to display a string on the web page in this format: 16:00 HH:mm

I'm using a moment object to represent a date/time and timezone.

var day = moment().tz('GMT');
day.hours(16).minutes(0).seconds(0).milliseconds(0);

So this is 16:00 in GMT time.

On my web page I want to change the time zone and then collect the hours and minutes.

If I make a new moment object

var day2 = moment().tz('PST); //this is 8 AM since gmt was 16
console.log(day2.get('hours'));

it is 16 not 8!

and try to get the hours and minutes they are in GMT not in PST.

How can I get it in PST? Do I have to keep wrapping it?

Solution 1

// initialize a new moment object to midnight UTC of the current UTC day
var m1 = moment.utc().startOf('day'); 

// set the time you desire, in UTC
m1.hours(16).minutes(0);

// clone the existing moment object to create a new one
var m2 = moment(m1);   // OR  var m2 = m1.clone();   (both do the same thing)

// set the time zone of the new object
m2.tz('America/Los_Angeles');

// format the output for display
console.log(m2.format('HH:mm'));

Working jsFiddle here.

If you can't get it to work, then you haven't correctly loaded moment, moment-timezone, and the required time zone data. For the data, you either need to call moment.tz.add with the zone data for the zones you care about, or you need to use one of the moment-timezone-with-data files available on the site.

In the fiddle, you can see the moment-files I'm loading by expanding the External Resources section.

Solution 2

PST can mean different things in different regions. In the moment-timezone docs, I see nothing referring to "PST" or similar abbreviations.

Perhaps try:

var day2 = moment().tz('PST'); 
// 16 with Error: Moment Timezone has no data for PST. See http://momentjs.com/timezone/docs/#/data-loading/.

var day2 = moment().tz('America/Los_Angeles'); 
// 15

Comments

[STLMikey]

are you getting an error in your console when using PST?

[user1261710]

Nope. Even with America/Los_Angeles the hour is wrong.

[Matt Johnson-Pint]

This will work in the case where you ignore DST and use -8 year round. It's nice clean code actually. However, it doesn't reflect reality since Pacific time uses -7 for daylight saving time. PDT is actually a larger part of the year now than PST! :D Most of the time, I find that when people say "PST", they mean "US Pacific Time". In my experience, it's actually quite rare to want to use PST without taking PDT into consideration. There are a couple of zones like America/Metlakatla and Pacific/Pitcairn that do that, but that's about it. I'd love to hear if you know otherwise.

[Matt Johnson-Pint]

Also, I may have misinterpreted part of your question in that you don't need to clone the moment if you don't want to. If you're fine with m1 changing, then you don't need to create m2.

[RobG]

@MattJohnson—yes. The OP only mentioned PST, hence my comments on daylight saving. I'm not a fan of using Date client side for any serious date manipulation, it's just not reliable (well, it's reliably borked).

[STLMikey]

If you're just trying to output a representation of the date, try using the format() method instead.