加载routerLink已经加载的Angular组件

Question

If a page or component is already loaded by a user clicking a routerLink in the main menu, how can I repeat same process if a user clicks that router link again? Clicking a router link that has already been clicked has no effect.

<ul class="nav navbar-nav" id="menu">        
    <li class="nav-item" id="signup-link"><a class="nav-link" routerLink="signup">Sign up</a></li>
    ...

Answer 1

Best practice is to call a function when the li component is being clicked and in that function you will reinitialize the component's properties.

<ul class="nav navbar-nav" id="menu">        
    <li (click)="reInit()" class="nav-item" id="signup-link"><a class="nav-link" routerLink="signup">Sign up</a></li>
    ...

And the component file:

@Component({
        ....
});
export class MyComponent {
        private property;
        reInit() { // this will reinitialize property
            this.property = null; // or 0 or [] etc.
        }

        setProperty(value) { // this will alter property
            this.property = value;
        }
        ...
}