I am taking the current URL with the router using the below code

this.router.events.subscribe(event => {
            if (event instanceof NavigationEnd) {
                this.currentRoute = event.url;
            }
        });

then im passing the currentRoute to a child component via @Input

<app-actions *ngIf="currentRoute" [currentRoute]="currentRoute"></app-actions>

in my child Component im taking the @Input() currentRoute: string;

issue is that the first time the component is rendered the currentRoute is visible but on any next URL change the Router Observable does not provide me with the latest value in the child component.

Any ideas?

CodePudding user response：

The Input does change, you're just not listening to it in the app-actions. In your child component, use the ngOnChanges life cycle hook like this

ngOnChanges(changes: SimpleChanges): void {
  console.log(changes);
}

Perform a re-assign operation within your app-actions component i.e., this.currentRoute = changes.currentRoute.currentValue and you're good