Angular DropDownButton

Customizable Button with a Drop Down List

The Kendo UI for Angular DropDownButton is a dropdown button which opens an additional list of action items in a popup when a user clicks on it. The Angular DropDownButton enables you to create the list of items from a data source, display icons, as well as define templates for a custom look and feel.

See Angular DropDownButton Overview demo.
Disabled DropDownButton

Out of the box, the Kendo UI for Angular DropDownButton becomes instantly active as soon as you add it to a page. When requirements call for users to be unable to interact with the component, the Angular DropDownButton can be disabled through a single configuration option. Individual actions can also be disabled for a more granular approach.

See Angular DropDownButton Disabled DropDownButton demo.
DropDownButton Icons

Items within the popup of the Kendo UI for Angular DropDownButton can be displayed as text, icons or a mix of text and icons. Icons can be set from the built-in Kendo UI for Angular theme, uploaded as an image or from third-party libraries like FontAwesome.

See Angular DropDownButtons Icon demo.
Data Binding

To create the Kendo UI DropDownButton, you can use a declarative approach and manually create all items or bind the Angular DropDownButton to an array of strings or objects.

See Angular DropDownButton Data Binding demo.
Templates

Use Angular Templates to define a custom layout and design for each item displayed in the Kendo UI for Angular DropDownButton popup.

See Angular DropDownButton Templates demo.
Keyboard Navigation

Thanks to its built-in keyboard navigation support, the Kendo UI for Angular DropDownButton lets users interact with the component using just their keyboard.

See Angular DropDownButton Keyboard Navigation demo.
Accessibility

The Kendo UI for Angular DropDownButton is WCAG 2.0 AA rated and compliant with WAI-ARIA and Section 508 accessibility standards.

See Angular DropDownButton Accessibility demo.