How to change the first day of week in Angular Calendar

25 Sep 20261 minute to read

The Angular 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 Angular 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';
bootstrapApplication(AppComponent).catch((err) => console.error(err));