New to Kendo UI for Angular? Start a free 30-day trial
DateRangeEndInputDirective
Manages the end date selection in a date range.
You can use the DateRangeEndInputDirective
only with a DateInput component.
typescript
@Component({
selector: 'my-app',
template: `
<kendo-daterange>
<kendo-dateinput kendoDateRangeStartInput [(value)]="startDate"></kendo-dateinput>
<kendo-dateinput kendoDateRangeEndInput [(value)]="endDate"></kendo-dateinput>
</kendo-daterange>
`
})
export class AppComponent {
public startDate: Date = new Date();
public endDate: Date = new Date();
}
Selector
[kendoDateRangeEndInput]
Inputs
Name | Type | Default | Description |
---|---|---|---|
autoCorrectOn |
|
Specifies the auto-correction behavior. If the start date is greater than the end date, the directive fixes the date range to a single date either on input change or on blur (see example). By default, the component does not perform any auto-correction. | |
navigateCalendarOnFocus |
|
|
Specifies the navigation behavior of the calendar when the active end is changed on input focus. When enabled, the calendar navigates to the value of the focused input. Otherwise, the calendar displays the last picked date. |