How to change the first day of week in Angular Calendar
31 Aug 20261 minute to read
The Calendar provides an option to change the first day of the week by using the firstDayOfWeek property.
The days of the week are represented by values from 0 (Sunday) to 6 (Saturday):
- 0 - Sunday
- 1 - Monday
- 2 - Tuesday
- 3 - Wednesday
- 4 - Thursday
- 5 - Friday
- 6 - Saturday
By default, the first day of the week is determined by the current culture. Setting the firstDayOfWeek property overrides the culture-based default.
The following example demonstrates the Calendar with Tuesday as the first day of the week by setting the firstDayOfWeek property to 2.
import { NgModule } from '@angular/core'
import { BrowserModule } from '@angular/platform-browser'
import { CalendarModule } from '@syncfusion/ej2-angular-calendars'
import { Component } from '@angular/core';
@Component({
imports: [
CalendarModule //declaration of ej2-angular-calendars module into NgModule
],
standalone: true,
selector: 'app-root',
template: `
<!-- Sets the firstDayOfWeek -->
<ejs-calendar [value]='dateValue' [firstDayOfWeek]='startWeek'></ejs-calendar>
`
})
export class AppComponent {
public dateValue: Date = new Date();
public startWeek: number = 2;
}import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import 'zone.js';
bootstrapApplication(AppComponent).catch((err) => console.error(err));