I am using ngx-progressbar bar in Angular 2 application. When app loading first it is working fine. second time it is showing error. I referred few article like medium.com for subscribe object. I did't get clearly. I need to make progress bar every time when click the router links.
progress bar code:
import { Component, AfterContentInit} from '@angular/core';
import { NgProgress } from 'ngx-progressbar'
@Component({
selector: 'link-outlet',
template: '<ng-progress [showSpinner]="false"></ng-progress>'
})
export class RoutingDirectiveComponent implements AfterContentInit{
constructor(private ngProgress: NgProgress) {
}
ngAfterContentInit(){
this.ngProgress.start();
setTimeout(()=>{
this.ngProgress.done();
}, 2000);
}
}
Your suggestion will be grateful.
This is happening because the component that holds the progressbar is being destroyed while the progressbar is running, so you should put <ng-progress></ng-progress>
in a root component (or a component that does not get destroyed)
If you are using the progress for router change event there is a feature module NgProgressRouterModule
If you are using the progress for http requests there is a feature module NgProgressHttpModule
Since v2.1.1, you can use the component anywhere without getting that error