Adding buttons in the header bar per controller

I defined my header in my index.html like:

 <ion-nav-bar class="bar-assertive">
        <ion-nav-back-button></ion-nav-back-button>
  </ion-nav-bar>
 <ion-nav-view></ion-nav-view>

Now, I would like to add buttons to the header-bar, but I only want to add certain buttons on certain controllers How can I do this if my header is defined in index.html?

1 Like

Define a Main controller in your index.html

    <body ng-controller = "MainController">
     <ion-nav-bar class="bar-assertive">
            <ion-nav-back-button ng-show="main.showbutton"></ion-nav-back-button>
          <ion-nav-back-button ng-hide="main.hidebutton"></ion-nav-back-button>
      </ion-nav-bar>
     <ion-nav-view></ion-nav-view>
</body>

and in MainController

app.controller('MainController', function($scope){

//define an object

$scope.main = {};
$scope.main.hidebutton = true;
$scope.main.showbutton = false;


});

than in other controllers change the value of object like

app.controller('SecondController', function($scope){

$scope.main.hidebutton = false; 
$scope.main.showbutton = true;

})
1 Like