angulartwitter-bootstrapngx-bootstrap

How to use ngx_bootstrap datepicker with french version


I'm using ngx-bootstrap datepicker in my angular project. I want to use the French version of datepicker, but it always gives me the English version. Here's my code :

html :

 <input type='text' class="form-control" placeholder="Date de l'aller :" bsDatepicker formControlName="dateDepart" />

component.ts:

import { defineLocale } from 'ngx-bootstrap/chronos';
import { fr } from 'ngx-bootstrap/locale';
defineLocale('fr', fr);

Any help, please, on how to use the French ngx-boostrap datepicker version?


Solution

  • Looks like you defined locale but haven't actually set it. Inject BsLocaleService from ngx-bootstrap/datepicker in your component and call its use('fr') method. Check the example here - https://valor-software.com/ngx-bootstrap/#/datepicker#locales (go to component tab and take a look at the code)