tl;dr: How can I force angular to only execute the ngclick directive in an <a>
element without emptying/removing the href
?
My site has some custom behavior on some elements (modal opens, location bar updates, etc.) but for SEO indexing I also need it to be an <a>
element with an href
attribute containing a valid link.
Such as:
<a href="/{{item.url}}" ng-click="doCustomStuff(item)">some link</a>
However, angular also executes the href
and the routing makes my custom ng-click
logic useless.
Is there a way to invert this behavior?
You should pass $event
parameter to onclick function and execute e.preventDefault()
method;
<a ng-click="clickHandler($event)" href="/home" >home</a>
and in controller:
$scope.clickHandler = function(e){
e.preventDefault();
}
Example:
http://plnkr.co/edit/sKHST3GkRENtxptxr0mK?p=preview
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With