Question

我有一个页面'/ categories'显示用户可以点击的多个类别。单击某个类别后，将显示详细信息页面，其中包含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'页面。

有没有什么好方法可以实现我的目标？

The article I was speaking about

提前致谢！

Answer 1

我找到了问题。

而不是

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

我应该用

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

因为我提供的网址不存在，所以应用路由模块将路由重定向到类别页面。

Angular - 从详细信息组件导航回来

1 个答案: