Develop Reference

How to get time format to HH:mm using moment js

I am working in React. I am troubled with getting right time format. I am selecting a time from drop down and used moment(inputTime,HH:mm) to format time, but this is how I get. What is the reason for it?
Is there any alternative way other than moment(inputTime).format("HH:mm")?
Moment {_isAMomentObject: true, _i: "Tue May 04 2021 03:53:21 GMT+0530 (India Standard Time)", _isUTC: false, _pf: {…}, _locale: Locale, …}
_d: Tue May 04 2021 03:53:21 GMT+0530 (India Standard Time) {}
_i: "Tue May 04 2021 03:53:21 GMT+0530 (India Standard Time)"
_isAMomentObject: true
_isUTC: false
_isValid: true
_locale: Locale {_calendar: {…}, _longDateFormat: {…}, _invalidDate: "Invalid date", _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, ordinal: ƒ, …}
_pf: {empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, …}
__proto__: Object

By using moment(inputTime,HH:mm), you are creating a moment object. Which is why you get Moment {_isAMomentObject: true, ...} when printing this object to the console.
If you want to have it in the format "HH:mm", it means that you want to have a string representation of your moment object in the format sus-cited. To do so, one of the correct way is to use the format method on the moment object.
var input_time = "10:46";
var date_a = moment(input_time, "HH:mm");
console.log(date_a);
>> Moment {...} // moment object
var date_a_str = date_a.format("HH:mm");
console.log(date_a_str);
>> "10:46" // string

Why I can't add years to a date using MomentJS into my Angular application?

I am working on an Angular application trying to use momentJS to add a specific number of years to a date but it seems not working.
This is my code:
changeGuaranteeEndDate(guaranteeDuration) {
console.log("changeGuaranteeEndDate() START");
console.log("GUARANTEE START DATE: " + this.newAssetForm.value.guarantee_start_date);
console.log("GUARANTEE DURATION: " + this.newAssetForm.value.guarantee_duration);
console.log("EVENT VAL: " + guaranteeDuration);
this.newAssetForm.value.guarantee_duration = guaranteeDuration;
console.log("GUARANTEE DURATION: " + this.newAssetForm.value.guarantee_duration);
let myMoment: moment.Moment = moment(this.newAssetForm.value.guarantee_start_date);
console.log("myMoment: ", myMoment);
let myMoment2 = myMoment;
myMoment2.add(3, 'y')
console.log("myMoment2: ", myMoment2);
}
So basivally I am creating the myMoment object starting from the date defined into this.newAssetForm.value.guarantee_start_date.
Then I am trying to create a new myMoment2 object starting from myMoment and I am adding 3 years to this object. Finnally I print it
The problem is that in the Chrome console I obtain the following output:
myMoment:
Moment {_isAMomentObject: true, _i: Fri Jan 29 2021 13:04:29 GMT+0100 (Ora standard dell’Europa centrale), _isUTC: false, _pf: {…}, _locale: Locale, …}
_d: Mon Jan 29 2024 13:04:29 GMT+0100 (Ora standard dell’Europa centrale) {}
_i: Fri Jan 29 2021 13:04:29 GMT+0100 (Ora standard dell’Europa centrale) {}
_isAMomentObject: true
_isUTC: false
_isValid: true
_locale: Locale {_calendar: {…}, _longDateFormat: {…}, _invalidDate: "Invalid date", _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, ordinal: ƒ, …}
_pf: {empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, …}
__proto__: Object
myMoment2:
Moment {_isAMomentObject: true, _i: Fri Jan 29 2021 13:04:29 GMT+0100 (Ora standard dell’Europa centrale), _isUTC: false, _pf: {…}, _locale: Locale, …}
_d: Mon Jan 29 2024 13:04:29 GMT+0100 (Ora standard dell’Europa centrale) {}
_i: Fri Jan 29 2021 13:04:29 GMT+0100 (Ora standard dell’Europa centrale) {}
_isAMomentObject: true
_isUTC: false
_isValid: true
_locale: Locale {_calendar: {…}, _longDateFormat: {…}, _invalidDate: "Invalid date", _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, ordinal: ƒ, …}
_pf: {empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, …}
__proto__: Object
The problems is that, as you can see in the previous output, it seems that the years was not added to the originalmyMoment object.
What is wrong with my code? What am I missing? How can I correctly add years to my original myMoment object?

It works for me.... you can test it clicking on Run code Snippet below.
You can try to use the same loaded lib of my example: src moment.min.js
function changeGuaranteeEndDate(guaranteeDuration) {
console.log("changeGuaranteeEndDate() START");
console.log("GUARANTEE START DATE: " + this.newAssetForm.value.guarantee_start_date);
console.log("GUARANTEE DURATION: " + this.newAssetForm.value.guarantee_duration);
console.log("EVENT VAL: " + guaranteeDuration);
this.newAssetForm.value.guarantee_duration = guaranteeDuration;
console.log("GUARANTEE DURATION: " + this.newAssetForm.value.guarantee_duration);
let myMoment = moment(this.newAssetForm.value.guarantee_start_date);
console.log("myMoment: ", myMoment);
let myMoment2 = myMoment;
myMoment2.add(3, 'y')
console.log("myMoment2: ", myMoment2);
}
// This is just for Testing the function... and mocking object
changeGuaranteeEndDate.apply({
newAssetForm:{
value:{
guarantee_start_date:new Date(),
guarantee_duration:undefined
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

Ok, you need format() to display the value of the moment object. Basically the problem is the initial value you pass to it. Read more about it in this answer. So your last console log should look like this:
console.log("myMoment2: ", myMoment2.format());

How to change the timezone of the date object

I am using moment to set/change the timezone of my date object and not any other date/time value
This is what I am presently doing :
const moment = require("moment-timezone");
const dateNew = moment.tz(accountDate, "US/Pacific");
This is the accountDate value: Mon Jul 08 2019 06:05:22 GMT-0400 (Eastern Daylight Time)
I want to change it to: Mon Jul 08 2019 06:05:22 GMT-0700 (Pacific Daylight Time)
but the dateNew is still in EDT timezone.
the output of `console.log(dateNew)` is :
Moment {_isAMomentObject: true, _i: Mon Jul 08 2019 06:05:22 GMT-0400 (Eastern Daylight Time), _isUTC: true, _pf: {…}, _locale: Locale, …}
_d: Sun Jul 07 2019 23:05:22 GMT-0400 (Eastern Daylight Time) {}
_i: Mon Jul 08 2019 06:05:22 GMT-0400 (Eastern Daylight Time) {}
_isAMomentObject: true
_isUTC: true
_isValid: true
_locale: Locale {_calendar: {…}, _longDateFormat: {…}, _invalidDate: "Invalid date", ordinal: ƒ, _dayOfMonthOrdinalParse: /\d{1,2}(th|st|nd|rd)/, …}
_offset: -420
_pf: {empty: false, unusedTokens: Array(0), unusedInput: Array(0), overflow: -2, charsLeftOver: 0, …}
_z: Zone {name: "US/Pacific", abbrs: Array(186), untils: Array(186), offsets: Array(186), population: 15000000}
__proto__: Object
but console.log(new Date(dateNew)) gives the following output.
Mon Jul 08 2019 06:05:22 GMT-0400 (Eastern Daylight Time)
Kindly help. Thanks

You are indeed changing the timezone, everything is working fine, just add a format(), I don't have enough reputation to comment this yet, lol, but why are you using Date(), just stick to moment()
const dateNew = moment.tz(accountDate, "US/Pacific").format();
console.log(dateNew)

Since you included reactjs tag. I will give you an answer in react.js way. You could install npm package named moment-timezone to solve this. Please take a look in their docs as well. Here is a full example in React
import React, { Component } from "react";
import ReactDOM from "react-dom";
import moment from "moment-timezone";
import "./styles.css";
class App extends Component {
render() {
const _date = "Mon Jul 08 2019 06:05:22 GMT-0400 (Eastern Daylight Time)";
const result = moment.tz(_date, "US/Pacific");
return (
<div>
<p>Origin Date : {_date}</p>
<p>
Converted Date : {result.format()} {result.tz()}
</p>
</div>
);
}
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
The above code will results like this

I'm posting it as another answer so I can add it as code #Tanu
const accountDate = 'Mon Jul 08 2019 06:05:22 GMT-0400 (Eastern Daylight Time)'
const dateNew = moment(accountDate).tz('US/Pacific')
console.log(dateNew.format('ddd MMM DD YYYY HH:mm:ss [GMT]ZZ zz'))
//OUTPUT: Mon Jul 08 2019 03:05:22 GMT-0700 PDT
Additionally, you can add change the abbreviations like this and add a parenthesis with some other square brackets:
var abbrs = {
EST : 'Eastern Standard Time',
EDT : 'Eastern Daylight Time',
CST : 'Central Standard Time',
CDT : 'Central Daylight Time',
MST : 'Mountain Standard Time',
MDT : 'Mountain Daylight Time',
PST : 'Pacific Standard Time',
PDT : 'Pacific Daylight Time',
};
moment.fn.zoneName = function () {
var abbr = this.zoneAbbr();
return abbrs[abbr] || abbr;
}
So the output would now bew:
console.log(dateNew.format('ddd MMM DD YYYY HH:mm:ss [GMT]ZZ [(]zz[)]'))
Mon Jul 08 2019 03:05:22 GMT-0700 (Pacific Daylight Time)

Date.toString(): How to prevent timezone name output in the PC locale in Chromium

In our logs we are using Date.toString() to store events timestamps.
Example:
Wed Nov 21 2018 02:04:38 GMT-0800 (Pacific Standard Time)
It is working well for us except when user's machine is in a locale other than English, then it would output timezone name in a local language (for example, Russian, Hebrew or Portugese)
Thu Nov 29 2018 16:21:07 GMT-0200 (Horário brasileiro de verão)
Is there a way to force toString() output to "EN-US" locale?

You can do it that way:
var options = { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric', hour: '2-digit', minute: 'numeric', second: 'numeric', timeZoneName: 'short' };
new Date().toLocaleDateString("en-US", options)
Output:
"Fri, Dec 14, 2018, 3:17:54 PM EST"

Moment.js is giving incostintent format responses

I have two moment objects:
> calEvent.start
Moment {_isAMomentObject: true, _i: "2015-06-11T11:00:00", _f: "YYYY-MM-DDTHH:mm:ss", _isUTC: false, _pf: Object…}_ambigTime: false_ambigZone: false_d: Thu Jun 11 2015 11:00:00 GMT+0300 (EEST)_f: "YYYY-MM-DDTHH:mm:ss"_fullCalendar: true_i: "2015-06-11T11:00:00"_isAMomentObject: true_isUTC: false_isValid: true_locale: f_offset: 0_pf: Object__proto__: Moment
> dateTime.startDT
Moment {_isAMomentObject: true, _i: "Th, 11-06-2015 11:00", _f: "dd, DD-MM-YYYY HH:mm", _isUTC: false, _pf: Object…}_d: Thu Jun 11 2015 11:00:00 GMT+0300 (EEST)_f: "dd, DD-MM-YYYY HH:mm"_i: "Th, 11-06-2015 11:00"_isAMomentObject: true_isUTC: false_isValid: true_locale: Object_pf: Object__proto__: Moment
When i'm formatting that two moment objects with same string it gives different responses:
> calEvent.start.format('YYYY-MM-DDTHH:mm')
"2015-06-11A11:00"
^
A? what is that? i was expecting 'T'
> dateTime.startDT.format('YYYY-MM-DDTHH:mm')
"2015-06-11T11:00"
^
This is correct one for me.
I tried to findout what is different between that objects and why moment.js is converting T to A.