3
   showBio(id) {
  this.router.navigate(['/speakers', {outlets: {'bio': [id]}}]);
}

How can I write it in [routerLink] and still can pass an id? I am following this example for reference: Example

Jayant Pareek
  • 360
  • 3
  • 18
  • you need to bind click event and in function you can write navigate line – Amee Prajapati Jan 24 '17 at 10:24
  • Yes, and that is working fine for me. However, I want to use it with [routerLink] as that should also be possible. I was earlier using [routerLink] without named routers. Now I am updating it with named outlets. – Jayant Pareek Jan 24 '17 at 10:29

1 Answers1

2

The route syntax stays the same with [routerLink] :

<a [routerLink]="['/speakers', {outlets: {'bio': [id]}}]">Link</a>

For this to work, the id property needs to be exposed to your template.

AngularChef
  • 13,797
  • 8
  • 53
  • 69
  • I also tried the same thing. But I am getting this error: Error: Cannot match any routes: 'speakers' At the same time, I am able to navigate to particular speaker bio by ShowBio(id). – Jayant Pareek Jan 24 '17 at 10:10
  • Did you use exactly this path - `'speakers'` - including the initial slash? Maybe you need to adjust the path. By default, routerLink paths are relative to the current path. My code assumes you have a `/speakers` **at the root** of your app. – AngularChef Jan 24 '17 at 10:27
  • yes, it is there in root routing module without '/'. – Jayant Pareek Jan 24 '17 at 10:32
  • Strange. And if you try the link without the `outlets` part, does it work? – AngularChef Jan 24 '17 at 10:45