How to refresh data in other components (Angular 7, router.navigate) when navigating from one to another?

Question

I am new to front-end dev, application is in Angular 7

My homepage contains list of items, clicking on each item will redirect to another page. While navigating I want the title bar (third component) to update with respect to the item which I clicked. Right now it only updates if I manually reload the page

I am using router for navigation

 router.navigate([route]);

.......EDIT.............

I have tried the following link....

https://medium.com/@rakshitshah/refresh-angular-component-without-navigation-148a87c2de3f

but it is throwing error - Object is unsubscribed,

Also tried activatedrouter instead of Router

Answer 1

try to update the title with this

  function updateDiv()
{ 
$( "#here" ).load(window.location.href + " #here" ); 
}

you can change #here(id) for .class(class) which you ill set on that title.it should update that part of a page without reloading