Kendo UI for Angular

TreeView

  • The easiest way to display hierarchal data either as data items or app navigation.
  • Part of the Kendo UI for Angular library along with more than 100 professionally-designed components developers trust for all their Angular UI needs.
  • Get up and running quickly with award winning support, detailed documentation, demos, virtual classrooms and a 3-million-strong developer community.

Angular UI Component Library
Nasa, Visa, Microsoft Fox, Samsung, IBM World Bank Group, Volvo
  • Overview

    The Kendo UI for Angular Tree View component is perfect for scenarios that require hierarchical data to be displayed in a tree structure, either as related data items or as navigation. Items in the Angular TreeView can be dragged and dropped in order to be reordered and users can choose to perform these interactions with either the mouse or keyboard.

    See Angular TreeView Overview demo.

    Kendo UI for Angular TreeView - Overview
  • Data Binding

    The Kendo UI for Angular TreeView has no restrictions for the type of data that can be bound, giving you ultimate flexibility to implement the Angular TreeView component.

    See Angular TreeView Data Binding demo.

    Kendo UI for Angular TreeView - Data Binding
  • Expanding Items

    You can program every node in the Kendo UI for Angular TreeView to be expanded or collapsed dynamically. You can also allow users to set the functionality upon initial render.

    See Angular TreeView Expanding Items demo.

    Kendo UI for Angular TreeView - Expanding Items
  • Load More Button

    When thousands or hundreds of thousands of rows need to be loaded at once, The Kendo UI for Angular TreeView provides a Load More button to improve performance and load the data in chunks. This allows you to define an initial set of data to load and then subsequentially load more as users continue to click the Load More button.

    See Angular TreeView Load More Button demo.


    Kendo UI for Angular TreeView - Load More Button
  • Dragging and Dropping

    With the drag and drop functionality of the Kendo UI for Angular TreeView, users can move and reorder nodes by a simple drag and drop interaction. Nodes can be dragged within a single or across multiple Angular TreeViews on the same page.

    See Angular TreeView Dragging and Dropping demo.

    Kendo UI for Angular TreeView - Dragging and Dropping
  • Node Templates

    With built-in support for Angular Templates, every node in the Kendo UI for Angular TreeView can be completely customized through a standardized template format. This gives you full control over the look and feel of the component.

    See Angular TreeView Node Templates demo.

    Kendo UI for Angular TreeView - Node Templates
  • Checkboxes

    The Kendo UI for Angular TreeView offers a single configuration option that renders a checkbox next to each node, giving users an intuitive and simple way to select one or several nodes.

    See Angular TreeView Checkboxes demo.

    Kendo UI for Angular TreeView - Checkboxes
  • Selection

    The Kendo UI for Angular TreeView allows for items to be selected by a simple click of the node or through checkboxes, which can be toggled on or off with a single configuration option.

    See Angular TreeView Selection demo.

    Kendo UI for Angular TreeView - Selection
  • Persisting State

    The Kendo UI for Angular TreeView enables you to persist several key aspects of the TreeView state, including the expanded or collapsed and enabled or disabled states of a node. This ensures that any update or re-render of the component can maintain state and not cause a disruption for the end user.


    See Angular TreeView Persisting State demo.
    Kendo UI for Angular TreeView - Persisting Focus
  • Keyboard Navigation

    The Kendo UI for Angular TreeView allows users to navigate through and interact with all nodes of the component using keyboard navigation.

    See Angular TreeView Keyboard Navigation demo.

  • Accessibility

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

    See Angular TreeView Accessibility demo.

    Kendo UI for Angular - Calendar Accessibility
Kendo Angular UI Getting Started Background

Get Started with Kendo UI for Angular

Kendo UI