Persisting the Expanded State

The TreeView enables you to define and persist the expanded state of its nodes when the component is re-rendered.

Basics

The TreeView exposes the following options to control the expand state:

• isExpanded (function)—Determines if a given node is expanded.
• collapse (event)—Fired when a given node is about to be collapsed.
• expand (event)—Fired when a given node is about to be expanded.

Change Theme

Theme

Loading ...

Built-in Directives

To persist the expanded state of the TreeView, either:

• Use the built-in ExpandDirective, or
• Set an item field.

Using the Built-In Directive

By default, the built-in ExpandDirective persists the expanded items based on their hierarchical index.

The TreeView renders the expand icons only after the children and hasChildren functions are defined.

Change Theme

Theme

Loading ...

Setting an Item Field

You can also persist the expanded state of the TreeView by item field—for example, the id field.

Change Theme

Theme

Loading ...

Expand Disabled Nodes

The component can be configured to allow exapnding disabled nodes by setting the expandDisabledNodes option to true.

Change Theme

Theme

Loading ...

Suggested Links

• Angular TreeView Homepage
• API Reference of the Angular TreeView