Angular使用[routerLink]时URL参数符号被转义的问题求助

你之前的写法错误地把查询参数（?id=xxx）直接拼进了路由路径字符串里，Angular会将路径中的特殊字符自动编码，导致出现%3F和%3D这类转义字符。以下是正确的实现方式：

1. 使用 [routerLink] 的正确写法 #

将路由基础路径和查询参数分开，通过 queryParams 属性单独传递参数：

<a [routerLink]="['/list/contentpage']" [queryParams]="{ id: item.id }">{{ item.title }}</a>

这样生成的URL会和你期望的一致：http://localhost:4200/list/contentpage?id=3838618

2. 使用 router.navigate() 的正确写法 #

同样把路径和查询参数分离，在第二个参数中传入 queryParams 配置：

<a (click)="linksClick(item.id)">{{ item.title }}</a>

linksClick(id: number) {
  this.router.navigate(['/list/contentpage'], { queryParams: { id } });
}

Angular的路由机制会自动处理查询参数的拼接逻辑，不需要手动在路径中写入?和=，通过queryParams传递键值对就能避免特殊字符被编码的问题。

内容的提问来源于stack exchange，提问作者davidArchA