I have ng-view and almost 40 controllers in my application and I have two button blocks and one of this block I show only on main page and the second block I show on rests pages (I simplified button blocks two one button in example). And also on some pages I don't need that buttons at all.
<div id="body">
<div id="header" ng-if="!hideHeader">
<button class="button" ng-if="mainPage"/>
<button class="button" ng-if="!mainPage"/>
</div>
<div ng-view=""/>
<div>
Those buttons belongs to $rootScope and elements are visible or hidden depends on root scope variables. I've created listener on root scope that called each time route changed. But in that case I see when one button block changed on another button block before ng-view changed the view, what is annoying.
$rootScope.$on('$routeChangeStart', function(next, current) {
$rootScope.hideHeader = true;
});
The second solution is to set hideHeader variable in controller. But in that case I need to set this variables in each controller. In that case the solution will be difficult to support. For example I will add another button block that want to show in one page only, it means I need to rewrite all controllers.
What is the best solution for that?
