在Angular2中传递多个路由参数

是否可以传递多个路由参数，例如，如下所示，需要将

id1

和

id2

传递到

组件B

@RouteConfig([
    {path: '/component/:id :id2',name: 'MyCompB', component:MyCompB }
])
export class MyCompA {
  onClick(){
    this._router.navigate( ['MyCompB', {id: "someId", id2: "another ID"}]);
     }
}

---

好吧，我意识到一个错误。。它必须是

/：id/：id2

无论如何，在任何教程或其他问题中都没有发现这一点

@RouteConfig([{path: '/component/:id/:id2',name: 'MyCompB', component:MyCompB}])
export class MyCompA {
    onClick(){
        this._router.navigate( ['MyCompB', {id: "someId", id2: "another ID"}]);
    }
}

如本文所述，mayur&user3869623的答案现在与不推荐使用的路由器有关。现在可以按如下方式传递多个参数：

要呼叫路由器：

this.router.navigate(['/myUrlPath', "someId", "another ID"]);

在routes.ts中：

{ path: 'myUrlpath/:id1/:id2', component: componentToGoTo},

---

角坐标系下传递多个路由参数的两种方法

方法1

在app.module.ts中

将路径设置为component2

imports: [
 RouterModule.forRoot(
 [ {path: 'component2/:id1/:id2', component: MyComp2}])
]

imports: [
 RouterModule.forRoot(
 [ {path: 'component2', component: MyComp2}])
]

使用多个参数id1和id2将路由器呼叫至naviagte至MyComp2

export class MyComp1 {
onClick(){
    this._router.navigate( ['component2', "id1","id2"]);
 }
}

export class MyComp1 {
onClick(){
    this._router.navigate( ['component2', {id1: "id1 Value", id2: 
    "id2  Value"}]);
 }
}

方法2

在app.module.ts中

将路径设置为component2

imports: [
 RouterModule.forRoot(
 [ {path: 'component2/:id1/:id2', component: MyComp2}])
]

imports: [
 RouterModule.forRoot(
 [ {path: 'component2', component: MyComp2}])
]

使用多个参数id1和id2将路由器呼叫至naviagte至MyComp2

export class MyComp1 {
onClick(){
    this._router.navigate( ['component2', "id1","id2"]);
 }
}

export class MyComp1 {
onClick(){
    this._router.navigate( ['component2', {id1: "id1 Value", id2: 
    "id2  Value"}]);
 }
}

---

以下是相同的教程，请参见路线部分。自答案发布以来，地段已发生变化。。您使用的是哪个版本的angular2？在ng2.0.0发布版本中：`constmyroutes:Routes=[{path:'compBPath/：id1/：id2'，component:mycopb}]；导出常量myRouting:ModuleWithProviders=RouterModule.forChild（myRoutes）；`在您的NgModule中，`@NgModule（{imports:[myRouting]，declarations:[MyCompB]，}）导出类MyModule{}导出类MyCompA{onClick（）{this._router.navigate（['compBPath'，'val1'，val2']）；}}我也同意@user3869623的说法。_router.navigate（['MyCompB'，{id:'someId'，id2:'other id}）；表示在@RouteConfig（[{path:'/component/:id/:id2'，name:'MyCompB'，component:MyCompB}]）：id/:id2是必需的路由参数，但它们是动态的。因为，可选的路由参数不需要在RouterConfig中声明。对于任何想知道的人，也可以在这些ID变量之间添加其他术语，这有助于创建更友好的URL。示例：此.router.navigate（['/mypath'，“firstId”，“secondPath”，“secondID”]）允许“mypath/4/secondPath/5”，在模板中使用routerlink时也可以这样做吗？我找不到解决办法。@julien-100000-是的，注释如下：[nsRouterLink]=“['/myUrlPath'，someId'，other ID']”“@EamonBohan你救了我一整天的调查，你是真正的MVP，谢谢你！！！我在app-routing.module.ts{path:

：${id1}/test/：${id2}

，component:DummyComponentComponent}中有这个作为我的路由路径，它不会为我加载组件，另外，我在index.html中有一个相对路径，如果我只保留一个参数，那么它会工作，但如果我将它扩展为have/export/：${id2}它停止工作了，有什么想法吗？