This sample demonstrates the basic rendering, overflow feature and navigable active item of the Breadcrumb component with icon support. Click the Reset State button to refresh Breadcrumb component states.
The Breadcrumb
component is used as a navigational aid to identify the current page location within the navigational hierarchy structure of websites. It has list of items that can be populated using the BreadcrumbItemDirective
tag.
Simple Breadcrumb
In this sample, the Breadcrumb is populated with text, icon, and URL.
Breadcrumb with Overflow
In the Breadcrumb component, maxItems
and overflowMode
properties were used to limit the number of breadcrumb items to be displayed.
In this sample, the maxItems
is set as 3
with overflowMode
as Menu
. To prevent breadcrumb item navigation we have set false
in enableNavigation
property of Breadcrumb component.
Active Last Breadcrumb
In this sample, navigation for the last item is enabled by using enableActiveItemNavigation
property.
More information about Breadcrumb component can be found in this documentation section.