Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set default format as ('dd/mm/yyyy') in ng-bootstrap

https://puu.sh/yThgV/bd55df9829.png

html

<label for="date">{{ "date" | translate }}</label>
<input type="date" class="form-control checking-field" id="date">

I want to get that format ('dd/mm/yyyy'). Any Suggestion?

like image 849
user3675191 Avatar asked Oct 17 '22 00:10

user3675191


1 Answers

extends my comment

In your app.module

import { NgbDatepickerConfig, NgbDateParserFormatter } from '@ng-bootstrap/ng-bootstrap';
import { NgbDateFRParserFormatter } from "./ngb-date-fr-parser-formatter"

@Component({
    providers: [{provide: NgbDateParserFormatter, useClass: NgbDateFRParserFormatter}]
})
export class AppComponent {}

In your NgbDateFRParserFormater

//your NgbDateFRParserFormater extends from NgbDateParserFormatter
//Is a Injectable that have two functions
@Injectable()
export class NgbDateFRParserFormatter extends NgbDateParserFormatter {
    parse(value: string): NgbDateStruct { //parse receive your string dd/mm/yyy
         //return a NgbDateStruct
         //calculate year,month and day from "value"
        return {year:year,month:month,day:day}
    }

    format(date: NgbDateStruct): string { //receive a NgbDateStruct
        //return a string
        return ''+date.day+'/'+date.month+'/'+date.year;
    }
}
like image 113
Eliseo Avatar answered Oct 20 '22 23:10

Eliseo