How to convert date into this 'yyyy-MM-dd' format in angular 2

Question

I want to convert current data into 'yyyy-MM-dd' format in .ts file. i template it can easily be done by using data pipe. how to do that in typescript.

In template:

{{date  | date:'yyyy-MM-dd'}}

How to convert in this format 'yyyy-MM-dd' in typescript.

now i am just getting current date by using this.

this.date =  new Date();

but need to convert it into given format. Please guide how to do that... Thanks!

Solution 1

The date can be converted in typescript to this format 'yyyy-MM-dd' by using Datepipe

import { DatePipe } from '@angular/common'
...
constructor(public datepipe: DatePipe){}
...
myFunction(){
 this.date=new Date();
 let latest_date =this.datepipe.transform(this.date, 'yyyy-MM-dd');
}

and just add Datepipe in 'providers' array of app.module.ts. Like this:

import { DatePipe } from '@angular/common'
...
providers: [DatePipe]

Solution 2

The same problem I faced in my project. Thanks to @Umar Rashed, but I am going to explain it in detail.

First, Provide Date Pipe from app.module:

providers: [DatePipe]

Import to your component and app.module:

import { DatePipe } from '@angular/common';

Second, declare it under the constructor:

constructor(
    public datepipe: DatePipe
  ) {

Dates come from the server and parsed to console like this:

2000-09-19T00:00:00

I convert the date to how I need with this code; in TypeScript:

this.datepipe.transform(this.birthDate, 'dd/MM/yyyy')

Show from HTML template:

{{ user.birthDate }}

and it is seen like this:

19/09/2000

also seen on the web site like this: dates shown as it is filtered (click to see the screenshot)

Solution 3

A simple solution would be to just write

this.date = new Date().toLocaleDateString();

date .toLocaleDateString() time .toLocaleTimeString() both .toLocaleString()

Hope this helps.

Solution 4

You can also use formatDate

let formattedDt = formatDate(new Date(), 'yyyy-MM-dd hh:mm:ssZZZZZ', 'en_US')

Solution 5

You can also try this.

consider today's date '28 Dec 2018'(for example)

 this.date = new Date().toISOString().slice(0,10); 

new Date() we get as: Fri Dec 28 2018 11:44:33 GMT+0530 (India Standard Time)

toISOString will convert to : 2018-12-28T06:15:27.479Z

slice(0,10) we get only first 10 characters as date which contains yyyy-mm-dd : 2018-12-28.

View more solutions

Comments

[Umar Rasheed]

i am getting this error when using moment cannot call a namespace('moment')

[Tinashe Chinyanga]

From a back-end perspective this is a good answer especially if one is consuming an API and the call returns an ill-formatted date.

[Sam Alexander]

you missed where to import this from: import { DatePipe } from '@angular/common';

[Rafael Moura]

Friend I can get data perfect ex: 30/08/2018 (date from Brazil), but if I want get only day or month or only years , how to do this ?

[Ahmed Hamed]

what you're looking for has been answered in the following SO question

[austin]

now there's a built in formatDate() function, just import from @angular/common angular.io/api/common/formatDate

[mik01aj]

Note that the ISO string will be in the GMT timezone, so your day might be off-by-one either way, depending on your timezone.

[Amrish Kakadiya]

Briliant , This is what developer need, not to append single day, month or year to create own format. cheers! mate... Thanks.

[youhans]

This answer is wrong. You completely missed the timezone. Have you tried the 2018-12-31T23:55:00.000Z?

[RED-ONE]

works well in the static method. thanks.