Angular Unknown Provider - $anchorScrollProvider - angularjs

Question

I'm probably missing something obvious here, but I'm out of ideas, so:
I have the following code:
app.run(function ($rootScope, $location, $anchorScroll, $stateParams, $timeout, $anchorScrollProvider) {
$rootScope.$on('$stateChangeStart',
function(newRoute, oldRoute) {
$timeout(function () {
$anchorScrollProvider.disableAutoScrolling();
$location.hash($stateParams.scrollTo);
$anchorScroll();
},
100);
});
});
I added the $anchorScrollProvider code today, and I'm getting the following error:
Error: [$injector:unpr] Unknown provider: anchorScrollProviderProvider <- anchorScrollProvider
Reading the documentation, it looks like $anchorScrollProvider is part of the base ng modules, which to me means the above should work, but why doesn't it?

Answer 1

The anchorScrollProvider can be injected in the config phase for calling the disableAutoScrolling function behavior.
anchorScrollProvider is part of the built-in ng-modules. Use $anchorScrollProvider to disable automatic scrolling whenever $location.hash() changes.
Some of the methods are related to the providers in configuration phase and should be invoked during the configuration of the app.
During the config phase, the providers have been registered but not run yet.
app.config(function ( $anchorScrollProvider) {
$anchorScrollProvider.disableAutoScrolling();
})
The rest of the code can be done in the run method:
app.run(function ($rootScope, $location, $anchorScroll, $stateParams, $timeout) {
$rootScope.$on('$stateChangeStart',
function(newRoute, oldRoute) {
$timeout(function () {
$location.hash($stateParams.scrollTo);
$anchorScroll();
},
100);
});
});