0

I receive a date from an object in a loop in this format : 2018-08-06 20:45:00

And I want to display only "20:45" (always with two digits for minutes) in the Timezone of the client. I have created this method in the methods part of vue.js :

ihaveadate(dateFromLoop) {
  var d = new Date(dateFromLoop);
  d.setTime(d.getTime() + new Date().getTimezoneOffset() * 60 * 1000);
  var hour = d.getUTCHours();
  var minutes = (d.getMinutes() < 10 ? "0" : "") + d.getMinutes();
  return `${hour}:${minutes}`;
}

It seemed to work fine except that on safari I have NaN:NaN, is there a clean solution to this problem ?

After reading ur answers i made it works like that :

var dateFromLoop = '2018-08-06 20:45:00';
var date = Date.parse(dateFromLoop.replace(" ", "T"));
const daty = new Intl.DateTimeFormat({
  hour: "numeric",
  minute: "numeric"
}).format(date);
console.log(daty);
RobG
  • 142,382
  • 31
  • 172
  • 209
yoyojs
  • 1,723
  • 5
  • 24
  • 41
  • The respective post might help you https://stackoverflow.com/questions/4310953/invalid-date-in-safari – Sivakumar Tadisetti Aug 06 '18 at 12:53
  • 1
    Related: [What are valid Date Time Strings in JavaScript?](https://stackoverflow.com/questions/51715259/what-are-valid-date-time-strings-in-javascript) – str Aug 07 '18 at 06:35
  • 1
    Your solution doesn't work in Safari, for me it returns "07/08/2018". The timestamp "2018-08-06 20:45:00" doesn't have an associated time zone, so the time should always be "20:45" regardless of the timezone of the host. But Safari's parser is buggy, "2018-08-06T20:45:00" will be treated as UTC, not local, so don't trust it. Your answer code doesn't compile, it has syntax errors and bugs. – RobG Aug 07 '18 at 09:42
  • as i receive only 2018-08-06 20:45:00 i did that : const loopy = dateFromLoop.replace(" ", "T") + ".000+02:00"; var date = Date.parse(loopy); const daty = new Intl.DateTimeFormat(locale, { hour: "numeric", minute: "numeric" }).format(date); return daty; – yoyojs Aug 07 '18 at 10:35

3 Answers3

3

yes, this will not work on safari, as for ECMAScript 5 ISO-8601 format support:

Alternatively, the date/time string may be in ISO 8601 format. For example, "2011-10-10" (just date) or "2011-10-10T14:48:00" (date and time) can be passed and parsed.

you need to include T withing the date time in order to make it work on Safari: 

new Date('2014-02-18T15:00:48');

you can try and do it like this:

new Date(dateFromLoop.replace(/\s/, 'T');
Barr J
  • 10,636
  • 1
  • 28
  • 46
  • 1
    That still produces an erroneous result in Safari. – RobG Aug 07 '18 at 09:30
  • can it depends on the version of safari because i see 20:45 on my side ? – yoyojs Aug 07 '18 at 12:20
  • @yoyojs—yes (tested in v 13.2.1 which is the current release). '2014-02-18T15:00:48' should be parsed as local so should return the same local date and time (i.e. 18 Feb 2014 15:00:48 regardless of local timezone), but Safari treats it as UTC, hence the different time for anyone with an offset other than +0. – RobG Jul 18 '20 at 03:13
1

For a clean solution There is a library called moment by using that you can do all your time and date manipulation

for your problem in Moment 

const d = new Date(yourDate);
const hourAndMin = moment().format('h:mm');

Refer Moment

Ananth
  • 77
  • 9
0

You can use Vanilla for this.

docs for parse

docs for format

The example direct from the source

var date = Date.parse('2018-08-06 20:45:00'.replace(' ', 'T'));

// toLocaleString without arguments depends on the implementation,
// the default locale, and the default time zone
console.log(new Intl.DateTimeFormat({
  hour: 'numeric',
  minute: 'numeric'
}).format(date));
RobG
  • 142,382
  • 31
  • 172
  • 209
Rafael Rossignol
  • 36
  • 1
  • 8
  • This work well but i have a shift of two hours in safari. I read in the doc that i can i find the user timezone like that var tz = Intl.DateTimeFormat().resolvedOptions().timeZone; but i don't know how to pass it in my DateTimeFormat – yoyojs Aug 07 '18 at 08:16
  • 1
    I can't understand why this is the accepted answer. The result In Safari 11 is "07/08/2018", the OP wants "20:45". Safari's parser is buggy, "2018-08-06T20:45:00" is incorrectly parsed as UTC so it will get the wrong time when using local methods and wrong date depending on the host timezone offset. – RobG Aug 07 '18 at 09:28
  • 1
    because, the op dimmed it the accepted answer and that's about it. It served his needs, so why must you question one's opinion and decisions? you are not the op of the question. – Barr J Aug 07 '18 at 09:35
  • 1
    @BarrJ—it doesn't serve the OP's needs at all. It produces the wrong result and is parsed differently in Safari to other browsers (it would show the wrong time if it did display the time and for me it shows the wrong date as well). If the OP hasn't realised those errors, it would be remiss not to point them out. – RobG Aug 07 '18 at 09:47
  • 1
    but on safari i see "20:45" not "07/08/2018", am i missing something there ? – yoyojs Aug 07 '18 at 10:32