Router events

Overview

Use this plugin to start and complete the progress bar with your router navigation.

Installation

NPM

$ npm i -S @ngx-progressbar/core @ngx-progressbar/router

YARN

$ yarn add @ngx-progressbar/core @ngx-progressbar/router

Usage

import { RouterModule } from '@angular/router';
import { NgProgressModule } from '@ngx-progressbar/core';
import { NgProgressRouterModule } from '@ngx-progressbar/router';

@NgModule({
  imports: [
    RouterModule.forRoot(...),
    NgProgressModule.forRoot(),
    NgProgressRouterModule.forRoot()
  ],
})

And just add the progress bar component in your template

<ng-progress></ng-progress>

NgProgressRouterConfig API

Name	Default	Description
id	root	Progress bar ID.
delay	0	The delay before completing the progress bar in ms.
startEvents	[NavigationStart]	Router events that starts the progressbar.
completeEvents	[NavigationEnd, NavigationCancel, NavigationError]	Router events that completes the progressbar.