New to Kendo UI for Angular? Start a free 30-day trial
YearCellTemplateDirective
Used for rendering the year cell content of the Calendar. To define the year cell template, nest an
<ng-template>
tag with the kendoCalendarYearCellTemplate
directive inside the component tag.
The template context is set to the current component. To get a reference to the current date, use
the let-date
directive. To provide more details about the current year cell, get a reference to the
current cellContext
by using the let-cellContext
directive.
For more examples, refer to the article on templates.
ts
@Component({
selector: 'my-app',
styles: ['.custom { color: red; }'],
template: `
<kendo-calendar [activeView]="activeView">
<ng-template kendoCalendarYearCellTemplate let-context="cellContext">
<span class="custom">{{context.formattedValue}}</span>
</ng-template>
</kendo-calendar>
`
})
export class AppComponent {
public activeView: CalendarView = 'year';
}
Selector
[kendoCalendarYearCellTemplate]