带有自动href的Angular routerLink

Question

在我的 Angular 应用程序中，我有很多按钮可以导航到不同的位置（导航栏等）。 由于我有一个单页应用程序 (SPA)，这当然是由 Angular 模拟的。

目前我正在使用[routerLink]指令进行路由，效果很好。 现在我希望我的按钮表现得更像真正的链接，例如ctrl + righ click​​应该在新选项卡中打开链接，右键单击应该显示普通锚链接的上下文菜单：

但当然，我仍然希望应用程序保持 SPA 状态，并且在单击链接时不重新加载。 是否有实现这一目标的最佳实践？ 我找到了RouterLinkWithHref指令，但我不知道这是否与它有关。

一个解决方法是设置routerLink和href指令。

<a routerLink="/" href="/"><button mat-stroked-button>Back to dashboard</button><a>

这增加了不那么漂亮的链接样式，感觉非常多余。 当然，这可以结合在自定义指令中，但我觉得我在这里描述的用例非常常见，因此应该有一个明确的解决方案。

为什么它不是routerLink的默认行为来显示上下文操作，就像它是一个真实的链接一样？ 将带有routerLink的元素转换为行为类似于真实链接的元素的最佳实践是什么（我希望我的应用程序中的所有路由器按钮、列表项等看起来像普通链接）？

Answer 1

我以这种方式在我的各种角度应用程序中实现了这一点

<a href="javascript:;" routerLink="/about-us">About us</a>

仍然不确定这是否是正确的做法，但对我来说，使用 ctrl+click 或右键单击等功能可以正常工作。