Date Conversion in javascript to (d MMMMM yyyy HH:mm am) without momentjs

Question

I have date in this format "2020-02-07T16:13:38.22" i want to convert this to " d MMMMM yyyy HH:mm a " to this format without using the momentjs.

below method is used to convert the date

const options = {
  day: "numeric",
  month: "long",
  year: "numeric",


}

var date1 = new Date("2020-02-07T16:13:38.22").toLocaleDateString("en-US", options);
const options1 = {
  hour12: true,
  hour: "numeric",
  minute: "2-digit",

}

var date2 = new Date("2020-02-07T16:13:38.22").toLocaleTimeString("en-US", options1);
var res = date1 + ', ' + date2;



console.log(res)

Above code gives the result "February 7, 2020, 4:13 PM" but i need "7 February 2020 4:13 PM" i.e date first then month and year and time and the code which i tried is longer please help me in the required result.

Extract year, month, etc. with getFullYear(), getMonth(), etc. and then assemble in a string? — Gianluca Paris, Feb 07 '20 at 16:41
Why do this without moment? Date handling libraries are exactly there to help you produce custom formatted dates. Sure, you can also do it without using one, assuming you know what you're doing but it *always helps* to not reinvent the wheel. — VLAZ, Feb 07 '20 at 16:42
Probably easier to Create an enum of Months and build it yourself by using the javascript date functions — MattE, Feb 07 '20 at 16:47
https://stackoverflow.com/questions/3552461/how-to-format-a-javascript-date — num8er, Feb 07 '20 at 16:51
@Vinuta: Did any answer work for you? If yes please do consider accepting/upvoting them. [What should I do when someone answers my question?](https://stackoverflow.com/help/someone-answers) — Nicholas K, Feb 13 '20 at 09:29

score 1 · Answer 1 · answered Feb 07 '20 at 16:43

In Angular I find it easiest to inject the date pipe for complex date formatting

import { DatePipe } from '@angular/common';
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ],
  providers: [    
    DatePipe
  ]
})
export class AppComponent implements OnInit  {
  constructor(private datePipe: DatePipe) {
  }

  formatted: string;  

  ngOnInit(): void {
    const d = new Date();
    this.formatted = this.datePipe.transform(d, 'd MMMM yyyy h:mm a');
  }
}

Working example: stackblitz

NB, I would normally format this in the html, but it looked like you were asking for a typescript solution.

score 1 · Answer 2 · answered Feb 07 '20 at 16:45

1

You may use the date pipe :

{{'2020-02-07T16:13:38.22' | date:'d LLLL yyyy h:mm a'}}

More details of the date formats can be found in the Date Pipe Angular docs.

answered Feb 07 '20 at 16:45

Nicholas K

14,118
7
25
49

MattE · Answer 3 · 2020-02-07T17:07:40.367

You would do something like this, but you would need to convert the hours to a 12 hour versus 24 hour format. Or if it it is being used in HTML use an angular pipe as stated above.

const event = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
const months =  ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']

var test =  event.getDate()  + ' ' + months[event.getMonth()] + ' ' + event.getFullYear() + ' ' + event.getHours() + ':' + event.getMinutes()

console.log(test)

Date Conversion in javascript to (d MMMMM yyyy HH:mm am) without momentjs

3 Answers3