how to navigates to new Ui component in angular 2?

i am using angular 2 RC 3 and router 3.0.0-alpha.8 and try to navigate to another UI component i am using PathLocationStrategy but it only update url but not UI

export const HomeRoutes: RouterConfig = [
{path:'search/:searchId',component:SearchListingComponent} ]

and inside my headerComponent i have this mathod

goToSearch(searchId: string): void{
  this.location.go('/search',searchId);}

which should navigates to search-listing page but it only update url. enter image description here

home.routes.ts file:

export const HomeRoutes: RouterConfig = [
{ path: '', component: HomeComponent },
{ path: 'home', component: HomeComponent },
{ path: 'search', component: SearchComponent },
{path:'search/:searchId',component:SearchListingComponent},
{ path: 'listing/:id', component: ListingPageComponent}
     ]

app.routes.ts file:

export const routes: RouterConfig = [
...HomeRoutes,
...UserRoutes,
...ProfileRoutes,
...LandownerRoutes
     ];
  export const APP_ROUTER_PROVIDERS = [
provideRouter(routes),
AUTH_PROVIDERS
      ];


ANSWERS:


You should use router to navigate

  //in header component 
    constructor(private router:Router){}
    goToSearch(searchId: string): void{
  this.router.navigate(['/search',searchId]);}


 MORE:


 ? Angular router v3: targeting named outlet
 ? Angular 2 Router - Cannot access child routes
 ? Angular 2 router does not reRoute to the right route after upgarding to RC.3
 ? Clear all queryParams with new Router v3 Angular2
 ? How can I dynamically position the <router-outlet> depending on the url called?
 ? Route navigation issue in RC4 angular2
 ? Route navigation issue in RC4 angular2
 ? Route navigation issue in RC4 angular2
 ? Issue with routerLink directive
 ? Error trying to reach github route