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 110+ professionally-designed components.
  • Includes support, documentation, demos, virtual classrooms, Visual Studio Code Extensions and more!
  • Select Multiple Items from a Hierarchical Dropdown List

    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

  • Adaptive Mode

    The Angular MultiSelectTree component supports an adaptive mode, enabling a mobile-friendly rendering of the component popup. The MultiSelectTree component automatically adapts to the current screen size and alters its rendering accordingly. 

    See the Angular MultiSelectTree Adaptive Mode demo 

    MultiSelectTree adaptive mode
  • 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

All Kendo UI for Angular Components

Next Steps

Get Started with Kendo UI for Angular

Kendo UI for Angular - Kendoka