Sub navigation interferes with main navigation back button

ionic-v1
1

Hello, I’m making an iPad app and I have a settings page that utilises the side-menu. I have a back button on the page that targets the main navigation of the entire app.
My problem now is that the back button is targeting the navigation of the settings page side-menu navigation instead of the main app navigation.

I tried setting the delegate-handle but that didn’t work.

This is my index.html

<body ng-app="starter" animation="slide-left-right-ios7"><ion-nav-bar class="bar-stable nav-title-slide-ios7" style="display: none;" delegate-handle="mainNav">
      <ion-nav-back-button class="button-icon icon  ion-ios7-arrow-back">
        Back
      </ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view></ion-nav-view>
  </body>

And this is my settings.html template

<ion-view>
    <ion-side-menus>
        <ion-side-menu-content>
            <ion-nav-bar class="bar-light nav-title-slide-ios7" delegate-handle="settingsNav">
                <ion-nav-back-button class="button-icon ion-arrow-left-c button-clear button-dark"></ion-nav-back-button>
            </ion-nav-bar>
            <ion-nav-view name="settingsContent">
                <ion-view>
                    <ion-header-bar>
                        <h1 class="title"></h1>
                    </ion-header-bar>
                    <ion-content class="padding">
                        <h4>Select option from right</h4>
                    </ion-content>
                </ion-view>
            </ion-nav-view>
        </ion-side-menu-content>
        <ion-side-menu expose-aside-when="large">
            <ion-header-bar class="bar-light">
                <h1 class="title">Settings</h1>
            </ion-header-bar>
            <ion-content>
                <ul class="list">
                    <a ng-href="#/settings/general" class="item"><i class="icon ion-gear-a"></i> General</a>
                    <a ng-href="#/settings/sync" class="item"><i class="icon ion-loop"></i> Sync</a>
                    <a ng-href="#/settings/account" class="item"><i class="icon ion-locked"></i> Account</a>
                </ul>
            </ion-content>
            <ion-footer-bar class="bar-light">
                <div class="buttons">
                    <button class="button icon-left ion-arrow-left-c button-clear button-dark" ng-click="goBack()"> Back</button>
                </div>
            </ion-footer-bar>
        </ion-side-menu>
    </ion-side-menus>
</ion-view>

And this is my SettingsCtrl that has the goBack function

.controller('SettingsCtrl', ['$scope', '$ionicNavBarDelegate', function($scope, $ionicNavBarDelegate){
    $scope.goBack = function(){
        $ionicNavBarDelegate.$getByHandle('mainNav').back();
    }
}]);

Edit: When I hit back before I’ve clicked any of the side-menu items, then it works properly and targets the main navigation but if I click on any of the side-menu items then it starts targeting the settings page navigation and not the main one anymore.

2

I’m facing the same issue. I have: left-side-menu > list with items > final-page. So my navigation would be: #app/submenu/final-page. But this does not work. If I change it to #app/final-page works great. Hope someone solve this.