CalendarComponent
Represents the Kendo UI Calendar component for Angular.
@Component({
selector: 'my-app',
template: `
<kendo-calendar></kendo-calendar>
`
})
export class AppComponent { }
Selector
kendo-calendar
Export Name
Accessible in templates as #kendoCalendarInstance="kendo-calendar"
Inputs
Name | Type | Default | Description |
---|---|---|---|
activeRangeEnd |
|
Specify, which end of the defined selection range should be marked as active.
| |
activeView |
|
Defines the active view that the Calendar initially renders
(see example).
By default, the active view is
| |
allowReverse |
|
|
Allows reverse selection when using |
animateNavigation |
|
|
Determines whether to enable animation when navigating to previous/next view.
Applies to the
|
bottomView |
|
Defines the bottommost view to which the user can navigate (see example). | |
disabled |
|
Sets or gets the | |
disabledDates |
|
Sets the dates of the Calendar that will be disabled (see example). | |
focusedDate |
|
Sets or gets the
| |
footer |
|
|
Toggles the visibility of the footer. |
max |
|
Sets or gets the | |
min |
|
Sets or gets the | |
navigation |
|
Sets or gets the | |
rangeValidation |
|
Determines whether the built-in min or max validators are enforced when validating a form. | |
selection |
|
Sets the Calendar selection mode (see example). The available values are:
| |
showOtherMonthDays |
|
Displays the days that fall out of the current month (see example). The default values per Calendar type are:
| |
tabindex |
|
Sets or gets the | |
topView |
|
Defines the topmost view to which the user can navigate (see example). | |
type |
|
Specifies the Calendar type. The possible values are:
| |
value |
|
Sets or gets the
| |
weekDaysFormat? |
|
|
Sets the format of the displayed Calendar week days' names. |
weekNumber |
|
Determines whether to display a week number column in the |
Events
Name | Type | Description |
---|---|---|
activeViewChange |
|
Fires when the active view is changed (see example). |
activeViewDateChange |
|
Fires when the active view date is changed
(see example).
Applies to the |
navigate |
|
Fires when navigating in the currently active view (see example). |
blur |
|
Fires each time the Calendar gets blurred (see example). |
focus |
|
Fires each time the Calendar gets focused (see example). |
valueChange |
|
Fires when the value is changed (see example). |
Methods
blur |
---|
Blurs the Calendar component. |
focus |
---|
Focuses the Calendar by making the table.k-calendar-table element active. ts
|