@alevettih/ngx-route-breadcrumbs

November 25, 2025 · View on GitHub

An Angular service that simplifies the creation of breadcrumbs that use routing url and params as a basis.

Overview

@alevettih/ngx-route-breadcrumbs is an Angular library that provides a simple way to create breadcrumbs from routing information.

Features

✅ Create breadcrumbs from routing info.
✅ Provide routing data/params into breadcrumbs with interpolation.
✅ Return metadata for implementing a "Back" button.
✅ Programmatically manipulate breadcrumbs (changes are rolled back when the contributing component is destroyed).
✅ Transform links based on route data (transformLink method).

API Overview

Service	Description
`RouteBreadcrumbsService`	Provides APIs for building and manipulating breadcrumbs sourced from routing information.

Member	Description
`items`	Signal that exposes the current breadcrumb collection.
`extend(params, destroyRef)`	Temporarily adds or patches breadcrumbs that fall back when the owning component is destroyed.
`getBack(breadcrumbs)`	Helper that returns the breadcrumb to use for "Back" navigation.

For a more detailed reference, see the library README.

Project Structure

ngx-route-breadcrumbs/
├── projects/
│   └── ngx-route-breadcrumbs/        # Library source code
│       └── src/
│           └── lib/
│               ├── helpers/       # Helpers and type guards
│               ├── models/        # TypeScript models
│               ├── services/      # RouteBreadcrumbs service
│               └── types/         # TypeScript types
├── dist/                          # Build artifacts
└── package.json