How to have more than one button assigned to leftButtons


#1

Hey guys,

I have a custom leftButtons object set for some pages. It is working great, but I really would like to have more than one button.

This is the example code for one button:

$scope.leftNavButtons = [{ 
    content: '<i class="icon ion-chevron-left"></i>',
    tap: function(e) {
        //function that slides back in history stack
    }
}];

Let’s say I want a back button and a toggle menu button. How would I go about doing that?

Thanks!


#2

Nevermind guys, I figured it out.

For anyone who runs across this in the future, I simply added another object to the leftNavButtons object like so:

$scope.leftNavButtons[1] = { 
    content: '<i class="icon ion-chevron-left"></i>',
    tap: function(e) {
        $scope.sideMenuController.toggleLeft();
    }
};

It’s important to remove the enclosing [ ]'s-- otherwise the object being pushed in is considered an array.


#3

It’s an array, so it can contain N elements :smile:

You should define right/leftButtons object like this:

  $scope.rightButtons = [{ 
    type: 'ion-compose button-icon button-clear',
    tap: function(e) {
  	$scope.sideMenuController.toggleRight();
    }
  }, 
  {
    type: 'ion-trash-a button-icon button-clear',
    tap: function(e) {
      // TODO Remove item.
  }
}];

Hope this helps!