how to pass route params in [routerLink] angular 2
You can work with queryParams
which works with routerLink
to build the url
. For ex:
<a [routerLink]="['/profiles']"
[queryParams]="{min:45,max:50,location:29293}">
Search
</a>
This will build a route like http://localhost:3000/profiles?min=45&max=50&location=29923
Good Luck.
you can try the code below: Your ts file will be like this:
@Component({ ... })
@Routes([
{
path: '/auth/signup?cell=1654654654', component: AuthComponent
}
])
export class AppComponent implements OnInit {
constructor(private router: Router) {}
}
And in you html file,
<a [routerLink]="['//auth/signup?cell=1654654654']"></a>
If your are going to use angula2 beta then you have to send parameter like this while doing routing.
<a [routerLink]="['signup',{cell:cellValue}]">Routing with parameter</a>
<input type='text' [(ngModel)]='cellValue'>
and than in the receiving side than you have to get parameter via using RouteParams
.
nut if You are going to use angular2 RC than you have to use RouteSegment
instead of using RouteParams
in angular2 RC. like this :-
import { Component } from '@angular/core';
import { Routes, RouteSegment, ROUTER_DIRECTIVES } from '@angular/router';
@Component({
selector: 'about-item',
template: `<h3>About Item Id: {{id}}</h3>`,
Directives: [ROUTER_DIRECTIVES]
})
class AboutItemComponent {
id: any;
constructor(routeSegment: RouteSegment) {
this.id = routeSegment.getParam('id');
}
}
@Component({
selector: 'app-about',
template: `
<h2>About</h2>
<a [routerLink]="['/about/item', 1]">Item 1</a>
<a [routerLink]="['/about/item', 2]">Item 2</a>
<div class="inner-outlet">
<router-outlet></router-outlet>
</div>
`,
directives: [ROUTER_DIRECTIVES]
})
@Routes([
{ path: '/item/:id', component: AboutItemComponent }
])
export class AboutComponent { }