Angular: 多个嵌套路由

Question

总结

• 我在产品页面上有一个产品列表 (url.com/products)
• 当我点击一个产品时，我会看到一个摘要和一个 link 来解决该产品的问题 (url.com/products/22) - （22 是产品编号）
• 当我点击 link 查看问题时，我卡住了。

我目前有什么

我可以很好地显示产品列表，我也可以在点击产品后显示一个页面，URL 变为 "url.com/products/10"。所以这对下面的工作很好。

<a [routerLink] = "['/product', product.productID]">
  {{ product.productName }} 
</a>

问题 是否可以使用路由器 links 来实现以下目的？

"url.com/products/10/issues/24"

• 产品：显示产品列表的产品页面
• 10: 所选产品 ID 为 10
• 问题：与该产品相关的问题列表页面
• 24:选中的问题ID为24

如有任何帮助，我们将不胜感激。谢谢。

Answer 1

是的，您可以通过以下方式做到这一点：

• 问题列表：[routerLink] = "['/product', product.productID, 'issues']".
  这将生成一个 link 到 /product/10/issues/

• 对于特定问题：[routerLink] = "['/product', product.productID, 'issues', issueID]"。
  这将生成一个 link 到 /product/10/issues/24

您可以通过 here 获得更多详细信息。