$state.go from ion-side-menus not working

Hi everyone,

I’ve just started my first app and got stuck an a simple problem. I try to have a button in a side-menu with should perform a state change, but although the ng-click function executes, the change never happens. I think I missed something about navigation, but I can’t figure out what.

Thanks in advance

page.html:

<ion-view>
    <ion-side-menus>
         <button class="button button-light icon ion-close" ng-click="endGame()"></button>
    </ion-side-menus>
</ion-view>

app.js:

.state('test', {
    url: '/testView',
    templateUrl: 'templates/page.html',
    controller: 'GameController'
})
.state('main', {
    url: '/',
   templateUrl: 'templates/mainview.html',
   controller: 'MainController',
   cache: false
 })

controller.js

$scope.endGame = function () {
    screen.unlockOrientation();
    $state.go("main");
};

You need to inject $state into your controller like:

.controller('controllername", function($scope, $state) {
  $scope.endGame = function () {
    screen.unlockOrientation();
    $state.go("main");
  };
});

Injection of $state to controller function is a must to change the state within the controller function,