Breadcrumb Configuration

Follow the following steps to configure breadcrumbs with routing:

1. Navigate to the required routing module module-name-routing.module.ts.

2. Breadcrumbs can be configured using the data property with the routing configuration.

There are four properties available:

• breadcrumb - to add a static string as breadcrumb Eg: 'Home'
• routeParamBreadcrumb - to use a parameter from route URL as breadcrumb Eg: ':id'
• routeResolveBreadcrumb - to use a value from route resolved data (before navigation) as breadcrumb Eg: 'username'
• addBreadcrumbLink - true by default, set addBreadcrumbLink: false to prevent adding a link to the breadcrumb

const routes: Routes = [
  Route.withShell([
    {
      path: 'path-name',
      component: ComponentName,
      data: { title: extract('Title'), breadcrumb: 'BreadcrumbName' },
      children: [
        {...}
      ]
    }
  ])
];

For reference, please look at:

self-service/self-service-routing.module.ts

accounting/accounting-routing.module.ts