0

我有一个页面“/类别”显示用户可以点击的多个类别。单击类别时，将显示详细信息页面，其中显示在 url '/categories/1' 中的类别 ID。

为此，我通过以下方式配置了我的应用程序路由模块：

{
    path: `${locale}/categories`,
    component: CategoriesComponent
  },
  {
    path: `${locale}/categories/:id`,
    component: CategoryDetailComponent
  }

我使用以下代码导航到详细信息页面：

this.router.navigate([getLocaleFromStorage(), category.id]);

问题是，当我在详细信息页面上并返回浏览器时，我被发送到页面'/categories/categories' 而不仅仅是'/categories'。

我的第一个想法是覆盖后退导航，但我还没有找到一个好的方法来做到这一点。我找到了一篇解释如何实现这种结构的文章，但是他们在页面中添加了一个后退按钮，并在单击该按钮时导航回正确的页面。这会起作用，但如果仅使用浏览器的后退按钮，用户仍会被发送到“/categories/categories”页面。

有什么好方法可以实现我想要的吗？

我说的那篇文章

提前致谢！

4

1 回答 1

0

我发现了问题。

代替

this.router.navigate([getLocaleFromStorage(), category.id]);

我应该用

this.router.navigate([getLocaleFromStorage()+'/categories', category.id]);

因为我提供了一个不存在的 url，所以路由被 App 路由模块重定向到类别页面。

于 2018-01-02T10:23:07.187 回答