• Getting Started
  • Components
    • Barcodes
    • Buttons
    • Chartsupdated
    • Conversational UIupdated
    • Data Query
    • Date Inputsupdated
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Filter
    • Gantt
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Map
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • PDFViewer
    • PivotGridupdated
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • ToolBar
    • Tooltips
    • TreeList
    • TreeView
    • Typography
    • Uploads
    • Utilities
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Sample Applications
  • FAQ
  • Troubleshooting
  • Updates
  • Changelogs
Components / Date Inputs / API / DateRangeService / 
New to Kendo UI for Angular? Start a free 30-day trial

DateRangeService

A service that handles the communication between the components that are placed inside the DateRangeComponent. For example, the start and end DateInput and DateRangePopup components.

NameTypeDefaultDescription

activeRangeEnd

SelectionRangeEnd

Gets the current activeRangeEnd value.

activeRangeEnd$

BehaviorSubject<SelectionRangeEnd>

An Observable instance that notifies when the activeRangeEnd state is changed.

dateRangePopup$

BehaviorSubject<DateRangePopupComponent>

An Observable instance that notifies when the DateRangePopup component is changed.

endInput$

BehaviorSubject<DateInputComponent>

An Observable instance that notifies when the end DateInput component is changed. For example, when a new end DateInput is attached or when the old one is detached.

focusedDate

Date

Gets the current focusedDate value.

focusedDate$

BehaviorSubject<Date>

An Observable instance that notifies when the focusedDate is changed.

max

Date

Gets the max range value. The max value is extracted from the end DateInput value or the max value of the Calendar.

min

Date

Gets the min range value. The min value is extracted from the start DateInput value or the min value of the Calendar.

range$

BehaviorSubject<SelectionRange>

An Observable instance that notifies when the state of the selection range is changed.

selectionRange

SelectionRange

Gets the current selectionRange value.

startInput$

BehaviorSubject<DateInputComponent>

An Observable instance that notifies when the start DateInput component is changed. For example, when a new start DateInput is attached or the old one is detached.

Methods

activatePopup

Activates the registered DateRangePopup component. The method opens the popup and focuses the calendar.

deactivatePopup

Deactivates the registered DateRangePopup component. The method closes the popup.

destroy

Completes all observables to mitigate possible memory leaks. Calls the method when a component that uses it is destroyed.

hasActiveComponent

Returns true when an active component that is placed inside the DateRangeComponent is detected. For example, the opened popup or the focused DateInput.

Returns

boolean

true if an active component is present.

registerEndInput

Registers a new end DateInput component. Notifies all endInput$ listeners.

Parameters

endInput

DateInputComponent

registerPopup

Registers a new DateRangePopup component. Notifies all dateRangePopup$ listeners.

Parameters

dateRangePopup

DateRangePopupComponent

registerStartInput

Registers a new start DateInput component. Notifies all startInput$ listeners.

Parameters

startInput

DateInputComponent

setActiveRangeEnd

Updates the activeRangeEnd value. Notifies all activeRangeEnd$ listeners.

Parameters

activeRange

SelectionRangeEnd

setFocusedDate

Updates the focused date. Notifies all focusedDate$ listeners.

Parameters

value

Date

setRange

Updates the selection range. Notifies all range$ listeners.

Parameters

range

SelectionRange

In this article

Not finding the help you need?

Contact Support