nlr_p nlr_p - 1 year ago 213
TypeScript Question

How to pass parameters to routes in angular2.0

I am trying to use the route params but not able to achieve it since when i importing the Routeparams it shows errors,,

My template,

<h6 class="headingh6 nobottommargin"><a [routerLink]="['User',{{detail.firstname}}]"> {{detail.firstname}} </a></h6>

My componenet

import { Component,OnInit} from '@angular/core';
import { Route, RouteSegment, ROUTER_DIRECTIVES } from '@angular/router';

selector: 'User',
templateUrl: './components/society/society.html',
export class User {
constructor(routeSegment: RouteSegment) { = routeSegment.getParam('id');

Can someone help me

My routes

import {provideRouter, RouterConfig} from '@angular/router';

import {DemoPage} from './demo-page';

import {User} from './components/user/user';

export const routes: RouterConfig = [
{ path: '', redirectTo: '/login', terminal: true },
{ path: 'login', component:Login },
{ path: 'signup', component:SignUp },
{ path: 'demo', component: DemoPage, children: [
{ path: 'user', component:User },
{ path: 'requests', component:Requests },

export const APP_ROUTER_PROVIDERS = [


Answer Source
<h6 class="headingh6 nobottommargin"><a [routerLink]="['User',detail.firstname]">{{detail.firstname}}</a></h6>

Don't use [] together with {{}}. Either one or the other, but not both at the same time.

To get router parameters use

constructor(private route: ActivatedRoute) {
  route.routerState.params.subscribe(p => console.log(p['id'));

See also Angular 2 rc4 ActivatedRoute query string params

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download