Search results

Change the first day of week in Angular Calendar component

01 Dec 2021 / 1 minute to read

The Calendar provides an option to change the first day of the week by using the

firstDayOfWeek property. Day of the week starts from 0(Sunday) to 6(Saturday).

By default, the first day of week will be based on culture.

The following example demonstrates the Calendar with Tuesday as first day of the week.

Source
Preview
app.component.ts
app.module.ts
main.ts
Copied to clipboard
import { Component } from '@angular/core';

@Component({
    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;
}
Copied to clipboard
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
//Syncfusion ej2-angular-calendars module
import { CalendarModule } from '@syncfusion/ej2-angular-calendars';
import { AppComponent } from './app.component';


/**
 * Module
 */
@NgModule({
    imports: [
        BrowserModule,
        CalendarModule //declaration of ej2-angular-calendars module into NgModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule { }
Copied to clipboard
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { AppModule } from './app.module';

enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule);