Kendo UI for Angular DropDownList Overview
The Kendo UI for Angular DropDownList is a form component that lets you choose a single predefined value from a list.
It is a richer version of the <select> element and supports data binding, filtering, templates, and default items.
Start Free Trial
The following example demonstrates the Angular DropDownList in action.
Change Theme
Theme
Loading ...
Key Features
- Data binding—You can bind the Angular DropDownList to a list of possible values containing arrays of primitive or complex data.
- Value binding—The DropDownList enables you to set its value to primitive or complex data.
- Filtering—Apart from its default filter functionality, the DropDownList provides options for setting a minimum length of the search symbols and a built-in filter directive.
- Grouping—You can group DropDownList items and display them as a grouped result.
- Virtualization—The Angular DropDownList supports a virtualization mechanism which noticeably improves the performance of the component when it handles large datasets.
- Default item—You can configure the default item of the DropDownList by using primitive or complex values.
- Disabled items—You can disable any of the DropDownList items and prevent users from interacting with them.
- Templates—You can customize the content of the DropDownList by using templates for its value, header, footer, and other elements.
- Forms support—You can use the DropDownList both in template-driven and reactive Angular forms.
- Adding new items—The Angular DropDownList allows you to render a button for the user to add new items to the list.
- Controlling the open state—The DropDownList enables you to configure the initially opened item and prevent the opening and closing of its options list.
- Cascading DropDownLists—The DropDownList enables you to render a series of two or more DropDownLists where each DropDownList is filtered based on the selected option in the previous DropDownList.
- Globalization—All Kendo UI for Angular Dropdowns provide globalization options.
- Accessibility—The DropDownList is accessible for screen readers and supports WAI-ARIA attributes.
- Keyboard navigation—The DropDownList supports a number of keyboard shortcuts for processing various commands.
To learn more about the appearance, anatomy, and accessibility of the DropDownList, visit the Progress Design System documentation—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
Support and Learning Resources
- DropDownList Homepage
- Getting Started with the Kendo UI for Angular Dropdowns
- API Reference of the DropDownList
- Angular DropDownList Features
- "How to Build Modern Angular Dropdowns in Minutes with Kendo UI"
- Getting Started with Kendo UI for Angular (Online Guide)
- Getting Started with Kendo UI for Angular (Video Tutorial)
- Video Courses
- DropDownList Forum
- Before You Start: All Things Angular (Telerik Blog Post)
- Knowledge Base