如何在 angular 8 中禁用到 <a href="#" > 的路由？

Question

我正在使用这样的本地参考

<a class="btn-floating btn-large blue" href="#">button</a>

但是 Angular 将我重定向到另一个 link localhost:4200/#

Answer 1

直接调用点击事件的preventDefault方法

<a class="btn-floating btn-large blue" href="#" (click)="$event.preventDefault()">
button
</a>

或者只删除 href 属性

<a class="btn-floating btn-large blue" >
button
</a>

您使用 scrollIntoView 方法在页面中导航。

<a (click)="skils.scrollIntoView({behavior: 'smooth'})">Skils </a>
....
<div #skils>...</div>

demo

Answer 2

你可以这样做。

<a class="btn-floating btn-large blue" href="javascript:">button</a>