coderbase-ngx-breadcrumbs v1.2.1

ngx-breadcrumbs

DEMO

DEMO

Installation

# install via npm
$ npm --save install @coderbase/ngx-breadcrumbs
# or install via yarn
$ yarn add @coderbase/ngx-breadcrumbs

To use this module you have to add it to the imports section in your app.module.ts. It should be lower than RouterModule import.

import { RouterModule } from '@angular/router';
import { McBreadcrumbsModule } from 'ngx-breadcrumbs';
@NgModule({
  imports: [
    RouterModule.forRoot(routes),
    NgxBreadcrumbsModule.forRoot()
  ],  
})
export class AppModule {}

Now you have to set it on the place in your global template. Usually, the best place is in AppComponent template.

@Component({
  selector: 'app-root',
  template: `
    <div class="container">
      <coderbase-ngx-breadcrumbs></coderbase-ngx-breadcrumbs>
      <router-outlet></router-outlet>
    </div>`
})
export class AppComponent {}

Configuration

Configuration of the breadcrumbs module is accessable in your route configuration.

const routes: Route[] = {
  {
    path: '',
    component: HomeComponent,
    data: {
      breadcrumb: 'Home',
      isHome: true,
      icon: 'fa fa-home',
      show: false
    }
  }
};