angularjs route - jump to specific page section on route link

I am trying to make some kind of a mix between an Angular anchor and routing...

I do have it working in the home page, since the anchor sections are there, however, if I am in another page, it does not.

Can anyone point me in the right direction on how to do it correctly, please?

Here´s what I have so far

freddoApp.config(function($routeProvider, $locationProvider) {
    $routeProvider

    // route for the home page
    .when('/', {
        templateUrl : 'pages/home/home.html',
        controller  : 'mainController'
    })

    // route for the productos page
    .when('/productos', {
        templateUrl : 'pages/home/home.html',
        controller  : 'mainController'
    })

    // route for the unico page
    .when('/unico', {
        templateUrl : 'pages/home/home.html',
        controller  : 'mainController'
    })

    // route for the sabores page
    .when('/sabores', {
        templateUrl : 'pages/home/home.html',
        controller  : 'mainController'
    })

    // route for the locales page
    .when('/locales', {
        templateUrl : 'pages/locales/locales.html',
        controller  : 'storeController'
    })

    // route for the servicios page
    .when('/servicios', {
        templateUrl : 'pages/servicios/servicios.html',
        controller  : 'servicesController'
    })

    // route for the about page
    .when('/about', {
        templateUrl : 'pages/about/about.html',
        controller  : 'aboutController'
    })

    // route for the contact page
    .when('/contact', {
        templateUrl : 'pages/contact/contact.html',
        controller  : 'contactController'
    });

    // use the HTML5 History API
    $locationProvider.html5Mode(true);
});

/............................./

    freddoApp.controller('mainController', function($scope, $location, $anchorScroll) {

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

/............................./

(HTML)

<div id="freedo-nav-bar" class="collapse navbar-collapse">
                <ul class="nav navbar-nav">
                    <li><a ng-click="scrollTo('productos')">Productos</a></li>
                    <li><a ng-click="scrollTo('unico')"> Freddo Único</a></li>
                    <li><a ng-click="scrollTo('sabores')"> Sabores</a></li>
                    <li><a href="#locales"> Locales</a></li>
                    <li><a href="#servicios"> Servicios</a></li>
                    <li><a href="#about"> Nosotros</a></li>
                    <li><a href="#contact"> Contacto</a></li>
                </ul>
            </div>

Thanks!