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.
The following example demonstrates the PanelBar in action.
Example
View Source
Change Theme:
Key Features
- Data binding—You can bind the PanelBar to an array of
PanelBarItemModelobjects 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
- PanelBar Homepage
- Getting Started with the Kendo UI for Angular Layout
- API Reference of the PanelBar
- API Reference of the PanelBarItem
- Getting Started with Kendo UI for Angular (Online Guide)
- Getting Started with Kendo UI for Angular (Video Tutorial)
- Virtual Classroom (Training Courses for Registered Users)
- PanelBar Forum
- Before You Start: All Things Angular (Telerik Blog Post)
- Knowledge Base
