при изменении маршрута, директива не получает имя класса $ route

В моем приложении, инициализируя, я добавляю каждую страницу в класс следующим образом:

$routeProvider
            .when ("/", {
                templateUrl : "views/login/login.html",
                controller  : "loginController",
                className   : "body-login" //class name for login page
        });

        $routeProvider
            .when ("/home", {
                templateUrl : "views/home/home.html",
                controller  : "homeController",
                className   : "body-home"  //class name for home page
        });

Он работает нормально. проблема в том, что у меня есть directive с условной загрузкой шаблона. когда страница изменяется пользователем по клику по ссылке, directive не работает по условию.

В случае, если я обновляю вручную (после загрузки страницы), directive работает нормально. как решить эту проблему?

вот моя директива:

var galleryMenu = ['$route','$timeout', function ($route, $timeout) {

    var page = $route.current.className || 'body-home'; //navigating page not updating the class name. but refresh do the correct job

        return {

            replace : true,

            template : function () {

            return galleryMenuItem(page); //passing page here.

        },

        link : function (scope, element, attrs) {

            scope.galleryProject = function () {

                scope.galleryShow = !scope.galleryShow;
                scope.appsList = !scope.appsList;

                if(scope.galleryShow) {

                    $timeout(function () {
                        window.scrollTo(0,document.body.scrollHeight);
                    }, 10)

                }

            }


        }

    }

}];

angular
    .module("tcpApp")
    .directive('galleryMenu', galleryMenu);

Мне нужно изменить способ, как я набираю имя class или мне нужно обновить загрузку страницы? - Я попытался использовать метод загрузки страниц, но не работал.

вот код, который я пробовал:

    angular.module("tcpApp", ["ngRoute","ngResource", "ngAnimate"])

        .run(['$route', function ($route) {

            $route.reload(); //but not working!

        }])

My Template Function :

var galleryMenuItem = function (page) {

    var html = "";

    switch(page) {

        case 'body-home' :
            html += '<div class="galleryMenu"><a class="projects" ng-click="galleryProject(projects)">projects</a></div>';
            break;

        case 'body-projectSummary' :

            html += '<div class="galleryMenu"><a class="live" ng-click="galleryMenu(live)" href="#">live</a>'
            html += '<a class="visual" ng-click="galleryMenu(visual)" href="#">visuals</a>'
            html += '<a class="projects" ng-click="galleryProject(projects)">shows</a></div>';
            break;

    }

    return html;

}