New to Kendo UI for Angular? Start a free 30-day trial
AgendaDateTemplateDirective
Updated on Oct 31, 2025
Use this directive to customize the date header in the Agenda view of the Scheduler.
To define a date template, nest an <ng-template> tag with the kendoSchedulerAgendaDateTemplate directive inside the
<kendo-scheduler-agenda-view> or <kendo-scheduler> component (see example.
The available fields in the template context are:
date—The header date.
html
<kendo-scheduler-agenda-view>
<ng-template kendoSchedulerAgendaDateTemplate let-date="date">
<!-- custom date header -->
</ng-template>
</kendo-scheduler-agenda-view>
Selector
[kendoSchedulerAgendaDateTemplate]