Angular子路由被编码

Question

找不到适用的示例，该示例适用于参数后使用的子组件路由的任何位置：

现在profile/userName有效但孩子没有

{ path: 'profile/:userName', component: ProfileComponent, 
    children: [
        { path: 'deets', component: DeetsComponent }
    ]
},    

我明白了 Error: Cannot match any routes. URL Segment: 'profile/admin%40admin.com/%5B'deets'%5D'

不确定这是否是网址中的编码或我的路由导致错误的错误？

使用Angular 4.1

Answer 1

＆＃39;简档/管理员％40admin.com /％5B＆＃39;％5D＆＃39;＆＃39的评价; url包含被编码的特殊字符，它们与路径定义的路径匹配。

参见w3schools：https://www.w3schools.com/tags/ref_urlencode.asp

Answer 2

我只是用它来使角度4.4工作; @ angular / cli 1.4.5;节点6.11.3;

<a routerLink="/detail/{{item.id}}" routerLinkActive="active"> DETAIL </a>

Answer 3

看起来您可能正在将输入传递给routerLink属性，但没有将输入属性包装在方括号中。

所以routerLink=与[routerLink]=之比。如果不包括方括号，则该链接将被视为字符串，并且在尝试导航至该路线时会看到这些编码错误。

 <a [routerLink]="['detail', item.id, 'deets']">DETAIL</a>