Configuring the ToolBar in the Angular TreeList
Starting with version 17.0.0, you can use the ToolBar component in the Kendo UI for Angular TreeList instead of the toolbar template. The ToolBar offers a set of built-in control types and allows you to include custom controls to enhance the TreeList's functionality.
To use the ToolBar component in the TreeList, define the kendo-toolbar component inside the <kendo-treelist> tag, add the desired elements, and configure them.
<kendo-treelist>
<kendo-toolbar>
</kendo-toolbar>
</kendo-treelist>Including the TreeList Built-In Toolbar Directives
With the introduction of the ToolBar component in the TreeList, new directives have been added to the TreeList to provide additional functionality and customization options. These directives are:
kendoTreeListAddTool—Adds a button that triggers the TreeList's add command.kendoTreeListPDFTool—Adds a button that triggers the TreeList's PDF export.kendoTreeListExcelTool—Adds a button that triggers the TreeList's Excel export.
<kendo-treelist>
<kendo-toolbar>
<kendo-toolbar-button text="Add new" kendoTreeListAddTool></kendo-toolbar-button>
<kendo-toolbar-separator></kendo-toolbar-separator>
<kendo-toolbar-spacer></kendo-toolbar-spacer>
<kendo-toolbar-button text="PDF Export" kendoTreeListPDFTool></kendo-toolbar-button>
<kendo-toolbar-button text="Excel Export" kendoTreeListExcelTool></kendo-toolbar-button>
</kendo-toolbar>
</kendo-treelist>The following example demonstrates the usage of the TreeList built-in toolbar directives.
Including the ToolBar Built-In Controls
The ToolBar component provides built-in control types that can be added to the TreeList toolbar. For more information, refer to the ToolBar Control Types article.
Including Custom Control Types
The ToolBar component allows you to include custom control types in the TreeList Toolbar, such as buttons, dropdowns, inputs, and others. Refer to the Adding Custom Tools to the ToolBar article for more information.