Select theme:

Material 3

Scheduler (Angular)link

This guide demonstrates how to use the Scheduler component.

Scheduler Propertieslink

NameTypeDefaultDescription
Namestring'scheduler' + index suffixUnique name of the scheduler.
DataarraynullScheduler data.
DefaultDatestringnullScheduler default date.
IdPropertystringnullScheduler data Id property name.
StartPropertystringnullScheduler data start property name.
EndPropertystringnullScheduler data end property name.
TitlePropertystringnullScheduler data title property name.
EditablebooleantrueIs scheduler editable.
WeekendsbooleantrueAre weekends visible.
LocalestringenScheduler locale. Can be set to it, fr, es, etc.
FirstDayOfWeeknumber0 (Sunday)The first day of week

image

Scheduler Eventslink

NameTypeDefaultDescription
EventSelecteventnullFired when event is selected. Event data as argument.
EventAddeventnullFired when event is added. Object with start and end date properties.
EventUpdateeventnullFired when event is updated. Event data as argument.

image

Angular declarationlink

<rz-scheduler #scheduler0 [data]="getBookingsResult" endProperty="EndDate"
  idProperty="Id" startProperty="StartDate" titleProperty="Title">
</rz-scheduler>

Get started today

Radzen is free to use. You can also test the premium features for 15 days.

Download Now
© 2016-2025 Radzen Ltd. All Rights Reserved.
Designed and developed with ❤️ in Radzen Blazor Studio.

Select theme:

Material 3