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


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

The DateRangeModule exposes the following directives:

To interlink the DateInput components, decorate them with either 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-dateinput kendoDateRangeStartInput [(value)]="range.start"></kendo-dateinput>
    <kendo-dateinput kendoDateRangeEndInput [(value)]="range.end"></kendo-dateinput>

In this article

Not finding the help you need?