Angular material datepicker dateformat

Question

I am trying to get the date from the datepicker and save it in sql server but the output is coming like '1538107200000'. What format is it and how to convert it to a date format which is compatible with sql server date format.

in component.html

<input matInput [matDatepicker]="picker" placeholder="enter date"
           (dateInput)="addEvent('input', $event)">
    <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
    <mat-datepicker #picker></mat-datepicker>

in component.ts

addEvent(type: string, dinput: MatDatepickerInputEvent<Date>) {
    this.dinput.push(`${dinput.value}`);
    this.date = new Date(this.dinput[0].toString());
    this.dates = moment(this.date, 'YYYY-MM-DD').toString();
    console.log(this.dates);
  }

this is giving error of invalid date. How to fix it? Please help.

This Date format is in chrono format

PrathapG
– PrathapG

2018-09-28 04:02:26 +00:00
Commented Sep 28, 2018 at 4:02 — PrathapG
– PrathapG, Commented Sep 28, 2018 at 4:02

Mukesh Verma · Accepted Answer · 2018-09-28 04:13:10Z

2

1538107200000 is date in millisecond (epoch timestamp). To convert it into date object use new Date(1538107200000). To get Date in desired format use moment(new Date(1538107200000)).format("YYYY-MM-DD"). This will give you date in YYYY-MM-DD Format. Now you need to save this in SQL Server. This will go to your server as String, you need to find what date format your server supports and cast that string to date and save to DB.

answered Sep 28, 2018 at 4:13

Mukesh Verma

5445 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Hasan Zubairi Over a year ago

what is this number? A float or int and how to parse it from string?

Mukesh Verma Over a year ago

You should take it as long.It is in milliseconds since epoch.

Justin · Accepted Answer · 2018-09-28 04:05:46Z

0

That is seconds since the epoc, see here. I believe you are not using the moment constructor correctly. Try this:

moment(this.date).format('YYYY-MM-DD').toString();

Either that or the value you are passing to the moment constructor is in a format that moment doesn't recognize. See the documentation.

answered Sep 28, 2018 at 4:05

Justin

7228 silver badges25 bronze badges

Comments

PrathapG · Accepted Answer · 2018-09-28 04:15:54Z

0

You are getting date in json format . Below is a custom filter to convert json date format to real date.

.filter("filterdate", function() {
var re = /\/Date\(([0-9]*)\)\//;
return function(x) {
    var m = x.match(re);
    if( m ) return new Date(parseInt(m[1]));
    else return null;
};
});

After that add below filter in component.html

<input {{dateInput| filterdate | date:'dd/MM/yyyy'}}>

edited Sep 28, 2018 at 4:15

answered Sep 28, 2018 at 4:09

PrathapG

7891 gold badge7 silver badges23 bronze badges

Comments

Ricardo Souza · Accepted Answer · 2021-06-08 18:22:07Z

0

You can use DatePipe too. Try this:

First Step, inject the DatePipe Provider on app.module.ts file:

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

@NgModule({
    ...
    providers: [
        [DatePipe]
    ],
   ...
})

And to convert your data into the desired format:

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

constructor(private datePipe: DatePipe) {}
    
this.datePipe.transform(this.myFormControl.value,'yyyy-MM-dd');

For more formats, follow the DatePicker documentation

answered Jun 8, 2021 at 18:22

Ricardo Souza

1

Collectives™ on Stack Overflow

Angular material datepicker dateformat

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related