CODEWITHSUNDEEP
angularjsangularjs-ng-clickpreventdefault
Tom
Tom

Reputation: 39

How to preventDefault on anchor tags using ng-click

after searching for the answer here, unfortunately nothing worked for me. So I'm hoping, by posting my code, you would be able to help... every time I click on one of the tabs, the page jumps up. how can I prevent it from happening? I believe the ng-click is causing it, since a regular jquery preventDefault() is not doing the job:

HTML: 

        <ul id="tabs" class="nav nav-pills">
            <li><a class="scroll" ng-click="myCtrl.tab=1">New York</a></li>
            <li><a class="scroll" ng-click="myCtrl.tab=2">Montreal</a></li>
            <li><a class="scroll" ng-click="myCtrl.tab=3">Rockey Mountains</a></li>
        </ul>

app.js:

(function() {
    var app = angular.module('myApp', []);
        app.controller('myController', function() {
        this.tab = 1;   
    });
})();

Upvotes: 1

Views: 3747

Answers (1)

taxicala
taxicala

Reputation: 21759

You can add $event.preventDefault() to the ng-click directive:

<ul id="tabs" class="nav nav-pills">
    <li><a class="scroll" ng-click="myCtrl.tab=1; $event.preventDefault();">New York</a></li>
    <li><a class="scroll" ng-click="myCtrl.tab=2; $event.preventDefault();">Montreal</a></li>
    <li><a class="scroll" ng-click="myCtrl.tab=3; $event.preventDefault();">Rockey Mountains</a></li>
</ul>

Upvotes: 5

Related Questions