Kendo UI for Angular TimePicker Overview

The Kendo UI for Angular TimePicker represents a time-list where the user can enter or pick time values.

The TimePicker Component is part of Kendo UI for Angular, a professional grade UI library with 100+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

The following example demonstrates the TimePicker in action.

Example
View Source
Edit In Stackblitz  
Change Theme:

Key Features

  • Disabled TimePicker—You can use the configuration options of the TimePicker to disable the component so that users are not able to interact with it.
  • Read-only TimePicker—The TimePicker provides a configuration option for rendering it in its read-only state.
  • Time ranges—Within the TimePicker, time ranges can be defined by setting a start and end time value.
  • Incremental steps—The TimePicker enables you to change the default step for increasing and decreasing the parts of its time values.
  • Formats—You can control the format of the TimePicker by using its format property.
  • Placeholders—The TimePicker provides options for setting its input field and render a text hint or descriptions for its format sections.
  • Incomplete date validation—The incomplete date validation feature of the TimePicker ensures that users do not accidentally leave a non-required field partially populated.
  • Forms Support—You can use the TimePicker both in template-driven and reactive Angular forms.
  • Integration with JSON—As the TimePicker works only with date JavaScript instances while the received data from the server is serialized in a JSON format, the component provides options for binding it to dates which are serialized as strings.
  • Globalization—All Kendo UI for Angular Date Inputs provide globalization options.
  • Accessibility—The TimePicker is accessible for screen readers and supports WAI-ARIA attributes.
  • Keyboard navigation—The TimePicker supports a number of keyboard shortcuts for processing various commands.

In this article

Not finding the help you need?