Kendo UI for Angular ExpansionPanel Overview

The Kendo UI for Angular ExpansionPanel provides a details-summary view that enables the user to expand or collapse the content.

The ExpansionPanel 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 ExpansionPanel in action.

Example
View Source
Edit In Stackblitz  
Change Theme:

Key Features

  • TitleThe ExpansionPanel enables you to define the content inside its header by using a title, subtitle, or a title template.
  • Interaction modesYou can set the initial expanded state of the ExpansionPanel and then change it on demand by using the available API options.
  • AnimationsYou can define the duration of the ExpansionPanel expand and collapse animations, and also fully disable the animations.
  • IconsThe ExpansionPanel enables you to customize its expand and collapse icon indicators.
  • Disabled ExpansionPanelYou can use the configuration options of the ExpansionPanel to disable the whole group of buttons or a single button so that users are not able to interact with it.
  • GlobalizationAll Kendo UI for Angular Layout components provide globalization options.
  • AccessibilityThe ExpansionPanel is accessible for screen readers and supports WAI-ARIA attributes.
  • Keyboard navigationThe ExpansionPanel supports a number of keyboard shortcuts for processing various commands.

In this article

Not finding the help you need?