CODEWITHSUNDEEP
javascriptangularjs
Websirnik
Websirnik

Reputation: 1412

ng-click while having href for fallback

Angular allows you to ignore href when using ng-click:

<a href ng-click="openModal()">Open modal</a>

But this is not suitable when you want to generate HTML snapshot for SEO or a PDF with active links.

Is there a way to have the following logic for this markup:

<a href="/modal" ng-click="openModal()">Open modal</a>

if ng-click is not available, use href action (at the moment href action will override ng-click)?

Upvotes: 0

Views: 454

Answers (1)

Yan Yankowski
Yan Yankowski

Reputation: 454

I'd wrap it in a directive inside which I'd call preventDefault to prevent the default behaviour of the link element:

app.directive("myLinkOverload", function () {
    return function (scope, element) {
        element.on("click", function (evt) {           
            evt.preventDefault();
        });
    }
});

<a href="/modal" ng-click="openModal()" data-my-link-overload="">Open modal</a>

Upvotes: 3

Related Questions