Using $ with different tabs


I have a probably simple problem, but at the moment I can’t find a solution: I have an app using the


on various side-menu inside different tabs.

I have a nav-bar in common between the tabs with a button to toggle the side-menu:

<ion-nav-bar class="bar-stable bar-dark nav-title-slide-ios7">
    <ion-button class="button icon button-clear ion-navicon-round button-open-aside" ng-click="toggleLeft()" ng-if="$root.showLeftButton" ng-hide="$"></ion-button>

The problem is that if I insert the nav-bar inside the view it works, but it won’t work if I insert it in the body beside the nav-view.

How could I mantain the nav-bar in the body (so I don’t have to duplicate it inside every view) and use the $ relative to the current tab shown?

Thanks in advance!


Could you put together an example of the layout you have in a codepen of plunker?


Probably not the best solution, but I solved passing the view $scope up to the root like this:

$scope.$root.scope = $scope;

and calling its $exposeAside in the main nav-bar like:

<ion-button class="button icon button-clear ion-navicon-round" ng-click="toggleLeft()" ng-if="$root.showMenuToggler" ng-hide="$root.scope.$"></ion-button>