Angular 角度路由器:忽略路径参数中的斜线
我有可以在参数中包含斜线或反斜线的动态路由,例如:Angular 角度路由器:忽略路径参数中的斜线,angular,typescript,url,routing,angular-router,Angular,Typescript,Url,Routing,Angular Router,我有可以在参数中包含斜线或反斜线的动态路由,例如: http://localhost:4200/dashboard/T64/27D我应该导航到带有路径的页面T64/27D 以下是我的导航方式 this.router.navigate(['dashboard/'+this.groupListPage[0].code]) this.groupList[0]。codecontainT64/27D 实际上,将T64和27D分为两个不同的页面 以下是错误: ERROR Error: Uncaught (i
http://localhost:4200/dashboard/T64/27D
我应该导航到带有路径的页面T64/27D
以下是我的导航方式
this.router.navigate(['dashboard/'+this.groupListPage[0].code])代码>
this.groupList[0]。code
containT64/27D
实际上,将T64
和27D
分为两个不同的页面
以下是错误:
ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'dashboard/T64/27D'
Error: Cannot match any routes. URL Segment: 'dashboard/T64/27D'
我如何才能告诉Angular,/
是参数的一部分?我认为使用pathparams不可能做到这一点。它将与queryparams tho完美配合
You must define it in your routes.
//if two param
{
path: 'dashboard/:id1/:id2',
component: yourComponent
}
//if only one param
{
path: 'dashboard/:id1',
component: yourComponent
}
{
path: 'dashboard',
component: yourComponent
}
and then navigate to your path
this.router.navigate(['dashboard/'+this.groupListPage[0].code]);
您也可以尝试用%2F来转义斜杠,但我不能100%确定角度会有多大/解析它。假设路线:
{
path: 'dashboard/:id',
component: FooComponent
}
和:ID可以存在于'ABC ','ab/c'}中,为了考虑内部'/'作为路径的一部分,需要使用自定义:
如果您的param
中有特殊字符,则可以通过以下方式使用navigate
方法,在此中可以找到仍在寻找此文件的任何人的工作示例:
this.router.navigate(['dashboard', param]);
这种方式将自动转义param
中的特殊字符,您可以做的是在不同的变量中获取参数的两个部分,例如在您的状态中的dashboard/:param1/:param2'
,然后使用param1+'/'+param2
重新组合它。从某种程度上说,这是一个解决办法,但它应该能解决问题。问题是我不总是有斜杠。这是一个可能的解决办法,但效果很差。在同一组件中处理id参数的重新组合是您没有包含的额外逻辑。问题是确定路由路径。所以我给出了恰当的答案。使用ActivateRoute获取参数值是额外的逻辑,但我没有将其包括在内,因为它与问题无关。这就解决了问题,解析好参数并自动转换%2F到/多亏了您,我发现了UrlMatcher,Nawsen响应解决了这个问题,在我的例子中,它比UrlMatcherIt更简单。很难找到真正有用的示例,如何用斜杠映射参数。非常感谢。喜欢它!只需2个提示即可使用:customMatcher是硬编码的,修改1)应用程序的路径==“dashboard”,以及2)返回的参数名(…{id:-我使用了路径/:工具而不是路径/:id,因此必须重命名为工具:idSegment
this.router.navigate(['dashboard', param]);