CODEWITHSUNDEEP
angularangular2-routing
Alexander Ciesielski
Alexander Ciesielski

Reputation: 10824

Change URL with Angular 2 RC6 Router

I am building a list app, where list-items can be selected. Only one item can be selected at a time. A detail-view for the list-item is displayed below the list.

Now I want to change the url based on which item is selected, without navigating to another page.

Is it possible? If yes, how?

Thanks

Upvotes: 1

Views: 2385

Answers (1)

Günter Zöchbauer
Günter Zöchbauer

Reputation: 657118

Use route parameters for this

{ path: '', redirectTo, 'items', pathMatch: 'full' },
{ path: 'items', component: ItemList, children: [
  { path: '', component: DummyItem },
  { path: ':id/detail', component: ItemDetails }
]}

<a [routerLink]="itemId + '/detail'">Item {{itemId}}</a>

class ItemDetail {
  constructor(route:ActivatedRoute) {
    route.params.subscribe(params => this.id = params['id']);
  }
}

With a router navigation, when only route params change, nothing is reloaded.

Upvotes: 2

Related Questions