ToolBarComponent

Represents the Kendo UI ToolBar component for Angular.

html

<kendo-toolbar>
     <kendo-toolbar-button text="Button"></kendo-toolbar-button>
</kendo-toolbar>

Selector

kendo-toolbar

Export Name

Accessible in templates as #kendoToolBarInstance="kendoToolBar"

Inputs

Name	Type	Default	Description
fillMode	ToolbarFillMode	'solid'	Sets the fill mode for the ToolBar. This property controls the background and border styles of the ToolBar (see example).
overflow	boolean | OverflowMode | ToolbarOverflowSettings	false	Sets the overflow mode for the ToolBar. Use this property to control how tools render when their total size is greater than the ToolBar container.
popupSettings	PopupSettings		Configures the popup for the ToolBar overflow button. Use this property to customize the overflow popup appearance and behavior (see example).
showIcon	boolean | DisplayMode	'always'	Sets the icon visibility for all tools in the ToolBar. You can override this property for each tool using the showIcon property of the tool.
showText	boolean | DisplayMode	'always'	Sets the text visibility for all tools in the ToolBar. You can override this property for each tool using the showText property of the tool.
size	ToolbarSize	'medium'	Sets the size for all ToolBar elements. Use this property to control the padding of the ToolBar elements.
tabindex	number	0	Sets the tabindex attribute of the ToolBar. Use this property to control the tab order of the ToolBar component.

Events

Name	Type	Description
close	EventEmitter<PreventableEvent>	Emits when the overflow popup of the ToolBar closes.
open	EventEmitter<PreventableEvent>	Emits when the overflow popup of the ToolBar opens.

Methods

toggle
Toggles the visibility of the overflow popup.
Parameters popupOpen? boolean