如何将参数传递给angular2.0中的路由

本文介绍了如何将参数传递给angular2.0中的路由的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试使用路由参数，但无法实现，因为当我导入Routeparams时，它显示错误，

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

我的模板

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

我的componenet

My componenet

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

@Component({
selector: 'User',
templateUrl: './components/society/society.html',
Directives: [ROUTER_DIRECTIVES]
})
export class User  {
id:any;
 constructor(routeSegment: RouteSegment) {
   this.id = routeSegment.getParam('id');
   console.log(this.id);
 }
}

有人可以帮我吗

我的路线

   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 = [
    provideRouter(routes)


  ];

推荐答案

<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'));
}

另请参见获取路线查询参数

这篇关于如何将参数传递给angular2.0中的路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

routeParams