Angular2单参数不路由选择工作

Question

我简单的路由不工作，我不知道为什么... 报道如下负载的命令PageNotFoundComponent，而不是OffertDetailComponent

app.routing

{ 
    path: "OffertDetail/:idOffert", 
    component: OffertDetailComponent 
}, 
{ 
    path: '**', 
    component: PageNotFoundComponent 
} 

路线命令

this.router.navigate(['OffertDetail', {idOffert: 1073}]); 

如果我从ap.Routing中删除“/ idOffert”，并从命令中删除参数，则组件会正确加载。

感谢支持

Answer 1

我相信你是混合查询参数和路由参数。试着改变你的router.navigate的同时保持路径"OffertDetail/:idOffert"如下：

this.router.navigate(['OffertDetail', '1073']); 

从https://angular.io/docs/ts/latest/guide/router.html#!#query-parameters

要设置查询参数：

// Set our navigation extras object 
// that contains our global query params and fragment 
let navigationExtras: NavigationExtras = { 
    queryParams: { 'session_id': sessionId }, 
    fragment: 'anchor' 
}; 

// Navigate to the login page with extras 
this.router.navigate(['/login'], navigationExtras); 

要使用路线PARAMS：

this.router.navigate(['/hero', hero.id]); 

并且参数获取名称来自路由器配置的:param。

要传递两个路由参数说我们的在我们的航线配置路径是path: "OffertDetail/:idOffert/detail/:someId"，我们可以传递参数，像这样：

this.router.navigate(['/OffertDetail', someParameter, 'detail', someOtherValue]);