CODEWITHSUNDEEP
javascriptangularbootstrap-4ngx-bootstrap
tolga
tolga

Reputation: 2800

Date format in Bootstrap Date Picker in Angular 6

In Angular 6, I apply date picker with a bsDaterangepicker class for a date range. 

<input type="text" (ngModelChange)="dateFilterChanged($event)" [(ngModel)]="myDateField" value="{{ myDateField | date:'yyyy-MM-dd' }}" [bsConfig]="{dateInputFormat: 'yyyy-MM-dd'}" bsDaterangepicker>

and emit the value with the following function and emitter:

dateFilterChanged(filterValue: string) {
    console.log('filterValue', filterValue);
    this.dateFilterChanged.emit(filterValue)
}

The problem is, the format of the emitted date is not "yyyy-MM-dd", but a gmt string:

[Wed May 01 2019 14:04:12 GMT+0300 (GMT+03:00), Sat Jun 15 2019 14:04:12 GMT+0300 (GMT+03:00)]

How can I get emit the date value in "yyyy-MM-dd" format?

Upvotes: 1

Views: 4228

Answers (3)

Hitesh Shukla
Hitesh Shukla

Reputation: 1

You can get that from https://momentjs.com/ and follow the instruction to install it. And they have mentioned all the Format Dates. Just pass the GMT string to moment() and you will get your desired format.

Upvotes: 0

Jagan Mohan Bishoyi
Jagan Mohan Bishoyi

Reputation: 66

You can use Date Pipe for this.
Example:

let dateObj = Your object;

And use the Pipe like below.

{{ dateObj | date }} // output is 'Jun 15, 2015'

Or there is a JS library called moment.

You can get that from https://momentjs.com/ and follow the instruction to install it. And they have mentioned all the Format Dates. Just pass the GMT string to moment() and you will get your desired format.

Upvotes: 1

Aarsh
Aarsh

Reputation: 2595

You can use date pipe like this :

{{ value_expression | date [ : format [ : timezone [ : locale ] ] ] }}

For more information visit this link :

https://angular.io/api/common/DatePipe

you can use it in typescript also ::

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

constructor(private datePipe: DatePipe,){
}
// in your function 
 element.last_assessment_date = this.datePipe.transform(element.last_assessment_date, 'yyyy-MM-dd');

Upvotes: 4

Related Questions