SwitchUp SwitchUp Ranked Best Coding Bootcamps 2025

Angular AnchorScroll and scrollTo reloads page when scroll to a div hash

Altcademy Team wrote on 7 February 2018

So I am using anchorScroll and scrollTo to allow user to scroll to different sections of a page, however, whenever the scrollTo link is clicked, the page reloads. Loading some external resources again. Can I prevent the reload behaviour?
<li><a data-scrollspy-listen="introduction" ng-click="scrollTo('introduction')" href="">Introduction</a></li>

$scope.scrollTo = function(id) { $location.hash(id); $anchorScroll(); }

From https://stackoverflow.com/questions/19978584/page-refresh-issue-in-angularjs
On the Documentation of routeProvider it states
[reloadOnSearch=true] - {boolean=} - reload route when only $location.search() or $location.hash() changes.
$routeProvider
.when('/search', { templateUrl : 'views/search.html', reloadOnSearch: false })
This will prevent the page from reloading when you change $location.hash.

Trusted by

Students and instructors from world-class organizations

Join the upcoming Cohort #111

Enroll for March 2nd, 2026