New to Kendo UI for Angular? Start a free 30-day trial

Dates

The main purpose of the DateRange is to allow the selection of dates by linking the default DateRangePopup with the Kendo UI for Angular MultiViewCalendar component.

The DateRangeModule exposes the following directives:

To interlink the Date Inputs components, decorate them either with a DateRangeStartInputDirective or a DateRangeEndInputDirective directive.

The following example demonstrates how to enable the date range selection by providing a minimum configuration to the DateRange.

<kendo-daterange>
    <kendo-dateinput kendoDateRangeStartInput [(value)]="range.start"></kendo-dateinput>
    <kendo-dateinput kendoDateRangeEndInput [(value)]="range.end"></kendo-dateinput>
</kendo-daterange>

In this article

Not finding the help you need?