假设我有一个锚标记,比如
<a href="#" ng-click="do()">Click</a>
如何防止浏览器在AngularJS中导航到# ?
假设我有一个锚标记,比如
<a href="#" ng-click="do()">Click</a>
如何防止浏览器在AngularJS中导航到# ?
当前回答
另一种可能是:
<span ng-click="do()">Click</span>
其他回答
既然你在制作网页应用,为什么还需要链接呢?
把锚换成按钮!
<button ng-click="do()"></button>
试试这个选项,我可以看到上面还没有列出:
<a href="" ng-click="do()">Click</a>
我需要存在href属性的值退化(当js被关闭),所以我不能使用空href属性(或“#”),但上面的代码没有为我工作,因为我需要一个事件(e)变量。我创建了自己的指令:
angular.module('MyApp').directive('clickPrevent', function() {
return function(scope, element, attrs) {
return element.on('click', function(e) {
return e.preventDefault();
});
};
});
在HTML中:
<a data-click-prevent="true" href="/users/sign_up" ng-click="openSignUpModal()">Sign up</a>
我认为:
<a ng-click="do()">Click</a>
因为根据文档,你应该可以离开href,然后Angular会为你处理防止的默认值!
整个这个防止默认的事情一直困扰着我,所以我创建了一个JSFiddle 说明了Angular在何时何地阻止了默认。
JSFiddle使用的是Angular的a指令——所以应该是完全一样的。您可以在这里看到源代码:一个标记源代码
我希望这将有助于澄清一些。
我本想把这个文档发布到ngHref上,但因为我的名声,我不能。
如果你从来不想去href…您应该更改标记,使用按钮而不是锚标记,因为从语义上讲,它既不是锚也不是链接。相反,如果你有一个按钮,做一些检查,然后重定向,它应该是一个链接/锚标签,而不是一个按钮…用于SEO目的以及测试[此处插入测试套件]。
对于你只想有条件地重定向的链接,比如提示保存更改,或确认脏状态…你应该使用ng-click="someFunction($event)"和在someFunction上你的validationError preventDefault和或stopPropagation。
而且,你能做并不意味着你应该做。Javascript:void(0)工作得很好…但是由于邪恶的黑客/破解者,浏览器标记应用程序/网站在href中使用javascript…看不出有什么理由在上面低头打字。
从2010年到现在已经是2016年了,没有理由在任何地方使用像按钮一样的链接……如果你仍然要支持IE8及以下版本,你需要重新评估你的公司。