The Kendo UI for Angular Time Picker is an input component that gives users an interactive way to enter time values in a form. When the user clicks or taps the time input field, the component will show spinners with available slots in any combination of hours, minutes, and/or seconds. The user selects his or her value and then it is represented in the appropriate format in the input field. With a large array of configuration options, the TimePicker is a versatile component for meeting your application requirements for helping users select any time of the day.
By setting the minimum and maximum configuration options of the Kendo UI for Angular TimePicker, you can limit the time slots available to users. Setting this available ranges helps ensure the user finds the value they need and ensures you get valid data.
The Kendo UI for Angular TimePicker has a format property to set the time format of the component. Standard time formats are built-in, but It can use any standard time format string for custom formats. Also, you can easily switch between 12-hour and 24-hour clocks.
With the placeholder feature of the Angular TimePicker component, you can provide a custom string to give users a contextual cue about what information they are expected to enter. For example, you can demonstrate the required format or you can show a hint that reads "select your desired time."
The TimePicker adaptive mode enables a mobile-friendly rendering of its calendar popup. Simply set the AdaptiveMode parameter to AdaptiveMode.Auto and this will trigger the component to automatically adapt to the current screen size and adapt its rendering accordingly. The adaptive mode for the TimePicker component also enables you to define the title text rendered in the popup header.
You can disable the Kendo UI for Angular TimePicker in order to prevent user interactions until certain requirements have been met. With the enabled property set to either true or false, the Angular TimePicker can toggle between enabled and disabled states.
The read-only mode allows you to display the Kendo UI for Angular TimePicker, while preventing users from modifying its current value.
The Kendo UI for Angular TimePicker supports both template-driven forms and Reactive forms. Since this component is primarily used in forms, our goal is to make it as universal as possible.
With support for various time formats, as well as the ability to translate built-in strings, the Kendo UI for Angular TimePicker is perfectly equipped for any globalization and internationalization scenarios.
Thanks to keyboard navigation, users can navigate through and interact with the Kendo UI for Angular TimePicker using their keyboard. This includes manually typing in a time slot as well as accessing the popup that shows all available time slots.
The Kendo UI for Angular TimePicker supports Section 508 and WAI-ARIA standards, and has an AAA rating with WCAG 2.0.