CanDeactivate and NavigationStart event

[meriturva]

We know, NavigationStart is fired before canDeactivate is called.
Main problem is that we have no way to disable and enable progress bar programmatically so I have to first call complete method:

 public canDeactivate(): Observable<boolean> | boolean {
    this.loadingBar.complete();

just to stop animation waiting user interaction result.
Result: we have progress bar completed but visible.

Any way to disable and enable it completely?

Thanks.

[aitboudad]

The loading bar shouldn't be visible when completed unless there are other pending requests,
can you provide me a reproduction example in order to investigate, here is a starter one https://stackblitz.com/edit/angular-sypacw.

Thanks!

[meriturva]

@aitboudad Thanks for your help.

I have implemented canDeactivate guard example to reproduce the issue:

https://stackblitz.com/edit/angular-adzxjm

As you can see canDeactivate just ask to use if it is sure or no to change the route. In meanwhile I have to complete the loading bar to hide it but we have a delay and the bar is showed for a few milliseconds.

How to approach that? Consider that we have routes that don't have canDeactivate guard.

[aitboudad]

Just published a fix in 5.0.0-alpha.0 which add the ability to control a specific loading bar instance through the useRef('router') method:

this.loadingBar.useRef('router').complete();

Please give it a try and let me know if that fixes the issue on your side.
Thanks!

[meriturva]

It seems to work! See: https://stackblitz.com/edit/angular-izoxwf

I will wait a new stable release anyway!
Thanks!