Как я могу направить запрос URL для получения данных, а также запустить функцию для изменения CSS в angularjs?

У меня есть ссылка, которая используется для загрузки данных, а затем я хочу изменить стиль CSS. Я хочу, чтобы и данные загружались, и изменение CSS происходило из одного события щелчка.

<section ng-controller="OffrdHeadCntrl">
<section id="menuOff" ng-class="{true: 'OpenMenu', false: 'ZeroWide'}[MenuStatus]">
    <b>Menu</b><br>
    <nav>
       <ul id='OffrdCat'>
          <li><a href="#Antiques">Antiques</a></li>
          <li><a href="#Appliances">Appliances</a></li>
       </ul>
    </nav>
</section>
     .... More HTML in another section here.
</section>

Это провайдер маршрута:

var ysshApp = angular.module('ysshApp', [
  'ngRoute',
  'ysshControllers',
  'firebase'
]);
  // 'ysshServices'

ysshApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/Antiques', {
        templateUrl: 'Client_Pages/Offered_Menu.html',
        controller: 'CommonController',
        customInput: 'zeg0yv7nxle6a5sr2xl-ezs'
      }).
      when('/Appliances', {
        templateUrl: 'Client_Pages/Offered_Menu.html',
        controller: 'CommonController',
        customInput: 'zh86tu488b8g6maw9wrfk'
      })
      .otherwise({ redirectTo:'/Tab_Home_1' });

  }]);

Когда пользователь нажимает «Антиквариат», загружается куча данных. Ссылка вызывает изменение URL-адреса, что приводит к тому, что $routeProvider использует контроллер, который затем загружает данные. У меня также есть функция, которая изменяет стиль CSS:

Это контроллер, который загружает данные:

var ysshControllers = angular.module('ysshControllers', []);

ysshControllers.controller('CommonController',
    function($scope, $http, $route) {
        $scope.dbKey = $route.current.customInput;
        $scope.urlToDb = 'https://' + $scope.dbKey + '.firebaseio.com/.json';
        $http.get($scope.urlToDb).success(function(data) {
            var values = [];
            for (var name in data) {
            values.push(data[name]);
            }
            $scope.UsedItems = values;
            });
            // Initially order by date and time
            $scope.orderProp = 'Time';
            }     
        );

Есть функция/контроллер? который изменяет CSS: (я удалил кое-что)

 function OffrdHeadCntrl($scope) {
    $scope.OpenCloseMenu = function() {
            if ($scope.MenuStatus === true) {
                $scope.OutputStatus = 'MuchWide';}
            else
                {$scope.OutputStatus = 'FullWideVal';}
 };
}

Я могу изменить либо CSS, либо данные для загрузки, но не то и другое одновременно. Я пытался поместить ng-click="OpenCloseMenu()" во всевозможные места, но либо routeProvider будет работать, либо изменение CSS, но не то и другое одновременно.

Я пытался добавить строки кода в общий контроллер, но это не сработало. Могу ли я добавить событие, которое запускается после завершения загрузки данных? Я видел примеры, в которых создается служба, связывающая несколько контроллеров, но она предназначена для привязки данных, а не для запуска события нажатия кнопки.

Я пытаюсь изменить CSS, чтобы скрыть часть меню на странице до загрузки данных. Я могу использовать свойство объекта Resolve, чтобы сначала что-то разрешить, прежде чем данные будут загружены. Это сработает, но у меня возникли проблемы с настройкой контроллера, чтобы он был доступен. Я могу заставить Resolve работать, но не могу запустить функцию. Если я добавлю это в routeProvider, появится предупреждающее сообщение, а затем, как только я нажму OK, данные загрузятся.

            resolve: {
                // Run code in resolve first
                whatever: function() {
                alert("it ran");
                }
            }

Это будет работать для меня, если я смогу получить функцию, которую мне нужно запустить, но я еще не понял этого.

Я успешно запустил $routeChangeSuccess, но он запускается ДО загрузки данных.

ysshControllers.controller('OffrdCatChg', function($scope) {
    $scope.$on('$routeChangeSuccess', function(){
        alert("it ran the success?");
    });
});

Так что не думаю, что мне это поможет. Я создал новый контроллер и поместил имя контроллера в тег HTML на этой странице. Он запускается при изменении маршрута, но запускается до загрузки данных. Это было бы нормально, но некоторые из моих других кодов запускаются после этого и возвращают CSS к оригиналу. Должен быть способ проверить запуск конкретного контроллера.