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
You should assign "true" to "html5Mode.requireBase"
relative link
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);
}
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.