Kendo UI for Angular PanelBar Overview

The Kendo UI for Angular PanelBar displays hierarchical data as a multi-level, expandable component.

To describe its items children, the PanelBar enables you to nest them as PanelBarItem components or to set the items property.

ninja-iconThe PanelBar is part of Kendo UI for Angular, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.Start Free Trial

The following example demonstrates the PanelBar in action.

Change Theme
Theme
Loading ...

Key Features

  • Data binding—You can bind the PanelBar to an array of PanelBarItemModel objects from a local or remote data source.
  • Items—The PanelBar provides a number of configuration options for its items such as setting their titles and disabled state, rendering icons and images next to them, and more.
  • Expand modes—The PanelBar supports the single, multiple, and full expand modes.
  • Templates—You can apply templates to instantiate the PanelBar items and customize its styles.
  • Animations—You can control the expand and collapse animations of the PanelBar.
  • Routing—The PanelBar can utilize the Angular Router in this way enabling you to use it as a navigational component.
  • Globalization—All Kendo UI for Angular Layout components provide globalization options.
  • Accessibility—The PanelBar is accessible for screen readers and supports WAI-ARIA attributes.
  • Keyboard navigation—The PanelBar supports a number of keyboard shortcuts for processing various commands.

Support and Learning Resources

Additional Resources