时间戳

首页 > 解决方案 > 浏览器无法导航到路由链接

angular - 浏览器无法导航到路由链接

问题描述

我有以下路线：

const routes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'about', component: AboutComponent },
  { path: 'contact', component: ContactComponent },
  { path: 'product', component: ProductComponent },
  { path: 'register', component: RegisterComponent },
  { path: 'login', component: LoginComponent },
];

在 home 组件中，我有一个链接列表：

<a class="linkCategoriesInner__link" routerLink="/?gender=men&category=1">ALL</a>
<a class="linkCategoriesInner__link" routerLink="/?gender=men&category=2">Jeans</a>
<a class="linkCategoriesInner__link" routerLink="/?gender=men&category=3">Jackets</a>
<a class="linkCategoriesInner__link" routerLink="/?gender=men&category=4">Coats</a>
<a class="linkCategoriesInner__link" routerLink="/?gender=men&category=5">T-Shirts</a>
<a class="linkCategoriesInner__link" routerLink="/?gender=men&category=6">Sneakers</a>
<a class="linkCategoriesInner__link" routerLink="/?gender=men&category=7">Hats</a>

当我单击其中任何一个时，控制台中出现错误：

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: '%3Fgender%3Dmen&category%3D3'
Error: Cannot match any routes. URL Segment: '%3Fgender%3Dmen&category%3D3'

为什么会发出此错误？

标签： angular

解决方案

您应该使用“queryParams”来传递参数。

<a class="linkCategoriesInner__link" routerLink="/" [queryParams]="{gender: 'men', category: 7}">Hats</a>

推荐阅读