Can't reload/refresh active route

Question

I have recently updated to the new RC3 and Router3alpha and it seems some things have changed.

I noticed that a click on the link of an active route does no longer result in the component to be reloaded. How do I achieve this behaviour with the new router3?

My link looks like

<a [routerLink]="['/link1']">Link1</a>

And to test I simply used a random number in ngOnInit:

export class LinkoneComponent implements OnInit 
{

    public foo: number;
    constructor() {}

    ngOnInit() 
    {
        this.foo = Math.floor(Math.random() * 100) + 1;
    }

}

It works just fine when switiching between routes, but a click on the currently active route does not result in a reload of the component.

Answer 1

If you really need to trick the Router into reloading the component on each routerLink click, you can use the following code in your Component

constructor(private router: Router){ // override the route reuse strategy this.router.routeReuseStrategy.shouldReuseRoute = function(){ return false; }

 this.router.events.subscribe((evt) => {
    if (evt instanceof NavigationEnd) {
       // trick the Router into believing it's last link wasn't previously loaded
       this.router.navigated = false;
       // if you need to scroll back to top, here is the right place
       window.scrollTo(0, 0);
    }
});

} Hope this helps

Answer 2

if (currentUrl.indexOf('/settings') > -1) {
    this.router.navigateByUrl('/communication').then(() => this.router.navigateByUrl('/settings'));
} else {
    this.router.navigate(['/settings']);
}

Answer 3

In my modest opinion you could use the window.location.reload() in typescript. This way can be easy and secure because is a part of the browser functionalities.