How to set start day of the week as Monday in kendo-datepicker for Angular

Question

I need to use kendo in my Angular project. But the requirement is once the date selection popup is open, starting day of the week should be Monday instead of Sunday which is the default behavior.

Current behavior:

<kendo-datepicker
    calendarType="classic"
    [animateCalendarNavigation]="true"
    [value]="value"
>

I searched a lot to find a setting like firstDayOfWeek='Monday' this, but unable to find anywhere.

If anyone know about it please share your thoughts.

Reference: https://www.telerik.com/kendo-angular-ui/components/dateinputs/datepicker/

Thanks.

Answer 1

Write a service that should overwrite the calendar intl service CldrIntlService. Create a service file first-day-intl.service.ts

import { Injectable } from '@angular/core';
import { CldrIntlService } from '@progress/kendo-angular-intl';

@Injectable()
export class FirstDayIntlService extends CldrIntlService {
    public firstDay(): number {
        return 1;
    }
}

In the @NgModule add the created service to the providers section.

providers: [
        {
            provide: IntlService,
            useClass: FirstDayIntlService,
        },
    ],

This will change the calender start day of the week.