Kendo UI for Angular

Angular MultiSelectTree

  • Show data-bound flat or hierarchical collections of selectable items in a customizable drop down.
  • Part of the Kendo UI for Angular library along with 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 Angular MultiSelectTree component gives you a surprisingly quick way to allow users to select one or more items from a hierarchical list of data. Much like the Angular DropDownTree, this component will automatically organize your data in a tree format and display it in a dropdown that users can easily access and select items from. The difference in the Angular MultiSelectTree is that users can select multiple values, each item displaying either as a token or text in the input element of the component. This is a valuable tool in your collection when you need on option to show complex data on limited screen space.

    See the Angular MultiSelectTree demo

    Angular DropDownTree Component - 200x370
  • Data Binding

    The MultiSelectTree includes tools to help you work with various types of data. Whether you simply need to connect to a data source, deal with hierarchical data, implement lazy loading, or load heterogenous data, you will find the experience easy.

    See the Angular MultiSelectTree data binding demo

  • Filtering

    Help your users narrow their tree list to the information they want to see with a built-in filter. With this feature enabled, a text filter field will appear at the top of the component’s drop-down list. As the user types, the list will be filtered.

    See the Angular MultiSelectTree Filtering demo

  • Disabled Items

    Enjoy complete control over your MultiSelectTree dropdown by disabling individual items.

    See the Angular MultiSelectTree disabled items demo

  • Persist Expanded State

    Give your users a better experience by persisting their last expanded state. If a user expands a node, navigates to another part of the app, and then returns, the MutiSelectTree will retain the state it was left in.

    See the Angular MultiSelectTree persisting expanded state demo

  • Templates

    Customize the content of your dropdown list header, footer, and nodes by specifying your own template. Also, configure a template that appears when there is no data present.

    See the Angular MultiSelectTree templates demo

Kendo Angular UI Getting Started Background

Get Started with Kendo UI for Angular

Kendo UI