Angular Scheduler Inputs & Outputs

Inputs & outputs

The full c-scheduler inputs, outputs, and the component instance API.

On this page

Inputs

<c-scheduler [events]="events" view="week" />
InputTypeDefaultDescription
agendaDaysnumber14Days shown (and stepped) by the agenda view.
businessHoursobject | nullnull{ daysOfWeek?, startHour, endHour, enforce? } — shades non-working time; enforce: true also rejects operations outside it.
dataSourceobject | nullnull{ getEvents(start, end), persistEvents? }remote data.
datestring | Date | nulltodayAnchor date of the visible range.
dayStartHournumber0First visible hour of the time grid.
dayEndHournumber24Hour the time grid ends at (exclusive).
eventsarray[]The events — see the event model.
eventOverlapbooleantruefalse rejects operations that would collide.
expandToFitbooleanfalseWiden events over adjacent free space.
firstDayOfWeeknumber1ISO weekday the week starts on.
hourHeightnumber48Pixels per hour in time-grid views.
labelsobject{}Overrides for the label set.
localestringbrowserBCP 47 locale for date/time formatting.
monthMaxEventsPerDaynumber4Chips per month cell before “+N more”.
recurringEditScopestring'occurrence'Initial scope for recurring edits: 'occurrence', 'future' or 'all'.
resourceColumnWidthnumber160Column width when the resource view virtualizes.
resourcesarray[]{ id, label?, color? } — columns of the resource view.
selectablebooleantrueAllow range-select creation and click selection.
snapnumber15Drag/resize/create step in minutes.
timeZonestringbrowserIANA zone all wall-clock math happens in.
timelineDaysnumber7Days covered by the timeline view.
timelineHourWidthnumber48Timeline horizontal zoom in pixels per hour.
viewstring'week''day', 'week', 'month', 'agenda', 'resource' or 'timeline'.

Outputs

OutputPayloadFires on
dateChangedateNavigation (prev/next/today, more-link jumps).
eventChange{ action, event, occurrence, revert, scope }Create, move, resize, update, delete.
selectionChangeselectionClick selection changes.
viewChangeviewView switch.

Component instance API

Grab the component with viewChild for the imperative surface:

MethodDescription
getEvents()Current events array (post-edits).
getSelection()Selected occurrence keys.
getVisibleRange()The visible window as { start, end } ISO strings.
navigate(direction)'prev', 'next' or 'today'.
setDate(date)Move the anchor date.
setEvents(events)Replace the events.
setView(view)Switch the view.
readonly scheduler = viewChild.required(SchedulerComponent)

goToday(): void {
  this.scheduler().navigate('today')
}