防止默认锚行为AngularJS

Question

当用户单击链接时,我想在控制器内的函数中执行一些代码.但我想防止URL发生变化.

我尝试了以下可能性

删除了href属性.没有工作,仍然将网址更改为'/'
尝试ng-click='deleteUser(user.id, $event)'并$event.preventDefault()在我的deleteUser() - 函数.没工作.
什么工作是我在GitHub上发现的关于无意中重新加载的黑客攻击.

这是我现在这样做的方式:

<a ng-click="deleteUser(user.id)" href="javascript:">Delete user</a>

题

防止链接更改URL的"清理"方法是什么？

Answer 1

<a ng-click="deleteUser(user.id)" href="">Delete user</a>

Answer 2

如果你看一下源代码的a元素指令(这是方芯的一部分),它规定在第29行- 31:

if (!element.attr(href)) {
    event.preventDefault();
}

这意味着Angular已经解决了没有href的链接问题.你仍然唯一的问题是css问题.您仍然可以将指针样式应用于具有ng-clicks的锚点,例如:

a[ng-click] {
    /* Styles for anchors without href but WITH ng-click */
    cursor: pointer;
}

因此,您甚至可以通过使用细微的,不同的样式标记真实链接然后执行功能的链接来使您的网站更易于访问.

快乐的编码!

Answer 3

真正的问题在于a 指令

没错，每个<a></a>元素实际上都是一个 AngularJS 指令。

如果你查看代码中的注释，它似乎修复了 IE 的一些问题。

但当我刚刚从 AngularJS 核心代码中删除该指令时，一切对我来说都运行良好。

我遇到了和你一样的问题，并尝试了所有其他解决方案。不同的是我只在 IE 中遇到这个问题。

如果您不想从源代码构建 AngularJS 脚本，只需在 angular.js 文件中搜索 htmlAnchorDirective 并将其删除/注释掉即可。

我相信这里有一个更大的问题应该在 AngularJS 核心中解决，但我还没有找到它。

更新：这个解决方案现在很可能已经过时了！您应该尝试使用最新的 AngularJS 版本。