Package Exports
- xng-breadcrumb
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (xng-breadcrumb) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
xng-breadcrumb
A lightweight, declarative and dynamic breadcrumbs solution for Angular 6 and beyond. https://www.npmjs.com/package/xng-breadcrumb
Why Choose Breadcrumbs?
Simplify Navigation: Breadcrumbs are vital in applications with deep navigation hierarchies, offering users an intuitive way to traverse back to higher levels effortlessly.
Documentation
For a step by step guide on integrating xng-breadcrumb into your Angular application, visit the Documentation.
Demo App
Explore our Demo App - showcasing the power of xng-breadcrumb
in an Angular setup. Experience seamless breadcrumb navigation as you browse through various links!
Features
✅ Zero configuration: Just add
<xng-breadcrumb></xng-breadcrumb>
anywhere in the app.Breadcrumb labels are automatically generated by analyzing Angular Route configurations.✅ Custom labels:Define custom labels for each route via Angular Route Configurations, enhancing breadcrumb clarity and relevance.
✅ Update labels dynamically: Change breadcrumb labels dynamically using
BreadcrumbService.set()
, utilizing either route path or route alias.✅ Skip breadcrumb: Conditionally exclude specific routes from breadcrumb display
✅ Disable breadcrumb: Can disable specific routes in breadcrumbs to prevent navigation to intermediate states .
✅ Customization: Customize breadcrumb template to display icons with label, apply text formatting using pipes, integrate i18n with ngx-translate, and more.
✅ Styling and Seperators: Easily customize breadcrumb separators and styles to match your application's design
✅ QueryParams and Fragment: Preserves QueryParams and Fragement while navigating via breadcrumbs
✅ SSR: Supports server side rendering with nguniversal
❤️ Become a Sponsor!
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!
To add new contributor username, who made a contribution of type contribution:
pnpm all-contributors add <username> <contribution>
Example: pnpm all-contributors add jfmengels code,doc