CODEWITHSUNDEEP
datepickerngx-bootstrap
Dani Mara
Dani Mara

Reputation: 51

ngx bootstrap datepicker: how can i change weekdays?

How can I change the weekdays in the ngx bootstrap datepicker ?

From: Mon, Tue, Wed, Thu, Fri, Sat, Sun To: M, T, W, T, F, S, T

Someone can help me ?

datepicker example

Upvotes: 1

Views: 2072

Answers (3)

Sajin M Aboobakkar
Sajin M Aboobakkar

Reputation: 4229

This worked for me (en-gb)

constructor(private localeService: BsLocaleService) {
    enGbLocale.weekdaysShort = ["S", "M", "T", "W", "T", "F", "S"];
    enGbLocale.week.dow = 0;
    defineLocale("en-gb", enGbLocale);
}

ngOnInit() {
   this.localeService.use("en-gb");
}

stackblitz

Upvotes: 0

Adolfo Rangel
Adolfo Rangel

Reputation: 71

In my case I want to use Spanish

import { Component, OnInit } from '@angular/core'; 
import { setTheme } from 'ngx-bootstrap/utils'; 
import { BsLocaleService } from 'ngx-bootstrap/datepicker'; 
import { defineLocale } from 'ngx-bootstrap/chronos'; 
import { esDoLocale } from 'ngx-bootstrap/locale';

@Component({   selector: 'app-root',   templateUrl: './app.component.html',   styleUrls: ['./app.component.scss'] }) export class AppComponent implements OnInit {   title = 'app';

  constructor(private localeService: BsLocaleService) {
    esDoLocale.weekdaysShort = ['L', 'M', 'M', 'J', 'V', 'S', 'D'];
    esDoLocale.week.dow = 0;
    defineLocale('es', esDoLocale);   }

  ngOnInit() {
    this.localeService.use('es');   }

}

Upvotes: 1

Dani Mara
Dani Mara

Reputation: 51

Thanks Himanshu,

I was able to solve this issue:

import { Component, OnInit } from '@angular/core';
import { setTheme } from 'ngx-bootstrap/utils';
import { BsLocaleService } from 'ngx-bootstrap/datepicker';
import { defineLocale } from 'ngx-bootstrap/chronos';
import { enGbLocale } from 'ngx-bootstrap/locale';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  title = 'app';

  constructor(private localeService: BsLocaleService) {
    setTheme('bs4');
    enGbLocale.weekdaysShort = ['S', 'M', 'T', 'W', 'T', 'F', 'S'];
    enGbLocale.week.dow = 0;
    defineLocale('en', enGbLocale);
  }

  ngOnInit() {
    this.localeService.use('en');
  }

}

Upvotes: 3

Related Questions