Redirection page with angularJS

Question

I use an angularJS script with a html page. I use this library : https://github.com/oblador/angular-scroll

I use a script provided by this library to have a scroll spy in my url. It works well but if I have a link to redirect to another page and it doesn't reload the page. The url changed but not the content. If I deleted the script the link works.

this is the script :

var myApp = angular.module('app_example', ['duScroll'])
.config(function($locationProvider) {
  $locationProvider.html5Mode({
    enabled: true,
    requireBase: false
  })
}).
run(function($rootScope, $location) {
  $rootScope.$on('duScrollspy:becameActive', function($event, $element){
    //Automaticly update location
    var hash = $element.prop('hash');
    if (hash) {
      $location.hash(hash.substr(1)).replace();
      $rootScope.$apply();
    }
  });
});

This is plunker with the script : http://plnkr.co/edit/emrTAvTPMKbLUNYi40Xq?p=preview

And the plunker without : http://plnkr.co/edit/xfsAWsLADkW6F98exC4P?p=preview

Answer 1

You should assign "true" to "html5Mode.requireBase"

relative link

Answer 2

In fact, we don't have to use $location, history is enough :)

The new script :

.run(function($rootScope, $location) {
    if(!history || !history.replaceState) {
      return;
    }
    $rootScope.$on('duScrollspy:becameActive', function($event, $element){
      //Automaticly update location
      var hash = $element.prop('hash');
      if (hash) {
        history.replaceState(null, null, hash);
      }
    });
  });