Angular js – restrict links to page refresh

With the anchor tags and routing used in Angular js Single Page Apps(SPA), we don’t want the entire controller to reload and refresh all the items.
To restrict the anchor tags from refreshing, you can add the directive to the main module

   .directive('a', [
    function () {
        return {
            restrict: 'E',
            link: function (scope, elem, attrs) {

                elem.bind('click', function (e) {
                    if (attrs.ngClick || attrs.href === '' || attrs.href == '#') {
                        e.preventDefault();
                        e.stopPropagation();
                    }
                })
            }
        };
    }
]);

Leave a Reply

Your email address will not be published. Required fields are marked *