单击锚元素时页面重新加载

Question

我正在开发一个 web 应用程序，它是一个传统的 aspx (asp.net) web 表单应用程序，但其中包含一些 angular 6 应用程序。

我的任务是修复一个错误，该错误会导致浏览器在单击带有 href=“#” 的锚元素时刷新。

我不确定是什么导致整个页面重新加载。

奇怪的是，当我在 Chrome 中打开开发工具时，选择网络选项卡并选择禁用缓存页面仅在我第一次单击链接时刷新，并且任何其他后续单击都可以正常工作。这可能与以下事实有关：在我第一次单击它之后，浏览器 url 现在在其末尾包含 #。

我知道这看起来有点随机，但我想知道是否有人对可能首先导致重新加载的原因有任何理论。

原文由 Tom Miller 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

在没有看到任何代码的情况下很难说出是什么导致了这种情况。当出现此行为时，我使用过的最常见的解决方案是防止默认。你可以做类似的事情

<a href="#" (click)="$event.preventDefault()">

或者，如果您已经有一个点击事件，则将 $event 作为参数传递给您的函数，然后在您调用的函数中使用 preventDefault。这看起来像：

HTML

 <a href="#" (click)="someFunc($event)">

在你的 ts 中：

 someFunc(event) {
    event.preventDefault();
    // rest of your code here
}

原文由 Derrick Awuah 发布，翻译遵循 CC BY-SA 4.0 许可协议