javascript - AngularJS/HTML - Cannot execute links to same page after introducing interceptor -

would check issue caused <a href> links when after introduced interceptor angular app , has cause links not reload when on same page? below how introduce interceptor add jwt's authentication token web service requests header.

app.config(['$httpprovider', function ($httpprovider) {     $httpprovider.interceptors.push(['$q', '$localstorage', '$location', function ($q, $localstorage, $location) {        return {            'request': function (config) {                config.headers = config.headers || {};                if ($localstorage.jwttoken) {                    config.headers.authorization = 'bearer ' + $localstorage.jwttoken;                }                return config;            },            'responseerror': function (response) {                if (response.status === 401 || response.status === 403) {                 }                return $q.reject(response);            }        };     }]); }]); 

noted presentation site , business logic processing part both independently separated , not rely on each other. means presentation site responsible load javascripts , html codes while scripts 1 responsible request data server. authentication done via jwt therefore use interceptor inject jwt related headers every restful requests.

php => (renders html template) + (data angular) <= angular => (send request server data)

using code above able complete jwt authentication causes <a href> links on presentation page not reload if in same page. example have 3 items in menu (home, page1, page2). when i'm in home , if click on home link, suppose reload page (like f5) nothing happens. need navigate away page able click on link.

what have done wrong here?

update 1: question @sanjeev: how handling routing in app, using ng-router module or custom ui-router module ? can add routing code well.

noted @ moment routes within html using links. javascripts not handle routes. responsibility , post data.

update 2: added plunker link. note suggest try both commenting , uncommenting entire interceptor section see difference when clicking link. follow these instruction below , recreate scenario mentioned.

1. load , run plunker file
2. on top right corner, click on "launch preview in separate window"
3. copy url in window , replace in section in line 25. url should run.plnkr.co/somerandomkeys+
4. close separate window , try clicking link in menubar.

when commenting said section, notices page load (acts refresh) when uncomment section link not work anymore. sort of same page detection thing blocking action.

solution :

analysis: ran demo , understood issue highlighting, issue not related interceptors @ all. interceptors called when make http requests using $http service.

in angular apps anchor tag behavior changes moment inject '$location' service in app, have injected '$location' service in interceptor module (although don't see being used). solves mystery why start getting anchor issue when add interceptor :)

in example anchor has same link current location angular preventing default behavior of anchor tag , clicking anchor not reload page.

you can solve multiple ways:

1. don't inject '$location' service if not using it, if can't remove go solution 2 or 3.

2. add attribute target="_self" or target="_blank" per case, solve issue without requiring js code change. tested fix code , worked me.

3. add ng-click handler on anchors , change window.location in it, or better create directive anchors , check if href same current location force page reload using location.reload()

4. if decide use angular routing great feature of angular js use $route.reload() method