CODEWITHSUNDEEP
angulartypescriptdate
EduBw
EduBw

Reputation: 942

How Can I format Date in typescript?

When I do new Date() in Angular2 (typescript) I GET -> DATEE Wed Jul 18 2018 09:13:40 GMT+0200

The problem is that I have sent Date to Java but Java doesn't let this format.

Java only let ,dd/mm/aaaa or aaaa/mm/dd but he doesn't let Wed Jul 18 2018 09:13:40 GMT+0200.

I try in Angular create a new format but always get String, but I need format Date because my class In Java get Date.

let myDate: Date, myDay, myMonth, myYear;

myDate = new Date();
myDay  = myDate.setUTCFullYear;
console.log(myDay);
myDay  = myDate.toISOString;
console.log(myDay);
console.log(typeof(myDay));
console.log(new Date(myDay));

I can not install libraries that angular does not bring by default for example: "moment". Ty

Upvotes: 19

Views: 121483

Answers (5)

Woworks
Woworks

Reputation: 1468

You can use Angular's DatePipe. In the component where you want to format:

add

providers: [DatePipe]

then import class

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

then inject in constructor

constructor(public datepipe: DatePipe){}

and then in the code you can format like

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

change format from 'yyyy/MM/dd' to any you need

Upvotes: 70

gandharva
gandharva

Reputation: 11

Property 'datepipe' does not exist on type 'HomeComponent'. Did you mean 'datePipe'?ts(2551)

i am getting aboue issue ,datePipe without declared

Upvotes: 1

Roy vd Wijk
Roy vd Wijk

Reputation: 111

I would like to answer this question a bit more in detail, instead of answering the initial problem, which was how to format a date in Typescript.

The problem that occurs is that you're unable to read the dates that typescript supplies. The answer to this is not to format the date in typescript, because this will still result in a string, as a formatted date gets converted to a string. Instead you need to parse the string date itself in Java using a function, and then you will have a date variable.

Dates will always be converted to a string when you send it as a response to Java, or any language for that matter. This is the case with any custom variable that is not a string, integer, or boolean (assuming your response is a JSON-format).

The solution to your problem is to just send the date and then use SimpleDateFormat(format).parse(date) to format the date, where format is your desired format, and date the string representation of the date.

Upvotes: 0

Shubham Verma
Shubham Verma

Reputation: 9933

Edit:

if you do not want to use any library then you can use builtin angular's DatePipe

Follow the step to use datePipe:

1: Import DatePipe:

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

2: Add **DatePipe in your module's providers:**

NgModule({
      providers: [DatePipe]
    })
    export class AppModule {
    }

Or you can add datePipe into your component's providers:

@Component({
      selector: 'target-selector',
      styleUrls: ['./target.component.css'],
      templateUrl: './target.component.html',
      providers: [DatePipe]
    })
    export class TargetComponent {
    ...

3: Now inject it into constructor:

constructor(private datePipe: DatePipe) {
}

4: Ready to use:

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

Or

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

Upvotes: 3

Sujay
Sujay

Reputation: 653

You can use

new Date().toLocaleString() => "11/10/2016, 11:49:36 AM"

then use string.slice to get the part opf the string you want

Upvotes: 6

Related Questions