Removing the back button on view change

ionic-v1
1

Hey guys,

trying to get rid of the back button when going from my log in page to the main view… any idea how I can do that from the controller?
I have tried all the solutions proposed on the forum and some were deprecated and others like $ionicHistory.clearCache(); just won’t work…

Thanks for your help in advance!

1 Like
2

Set <nav-page hide-back-button=“true”> to hide it for a page (or pages).

3

how do I set that in the controller thought?

4

No you write that in the HTML

5

You can use $ionicNavBarDelegate.showBackButton(false)

http://ionicframework.com/docs/api/service/$ionicNavBarDelegate/

1 Like
6

Hi thanks that works! :smile:

How do I get the side menu button appear again? I tried:
$ionicSideMenuDelegate.toggleLeft(true);
but it opens it and that’s not what I want
Also I am not sure why but I lost the back button on all states now…

7

I did that in my state to get rid of the back button and keep the menu button
cache: false,
however knowing the js to show the button would be awesome :slight_smile:

8

So I’m guessing somethings wrong in the markup for the project.

This is how a sidemenu project should be set up

9

that’s the one I used to start building the app.
Basically here is what I do:

// Home when logged in
  .state('app.home', {
    cache: false,
    url: "/home",
    views: {
      'menuContent': {
        templateUrl: "templates/home.html",
        controller: 'HomeCtrl'
      }
    }
  })



  /*
 * Home Controller
 ------------------------------------------------------*/
.controller('HomeCtrl', function($scope, $state, $ionicNavBarDelegate, $ionicSideMenuDelegate) {
  // remove back button show the side menu icon after login - Doesn't work how it is supposed to
  //$ionicNavBarDelegate.showBackButton(false);
  //$ionicSideMenuDelegate.toggleLeft(true);
 
})
10

I think what you want to do is set the home state to the root of the navigation stack. This will make it so you can’t go back to the login page but the menu icon will show:

$ionicHistory.nextViewOptions({
    historyRoot: true
});
$state.go('app.home');

I put this in a function in a service and call it every time I want to navigate to the home page.

2 Likes
11

do you mind sharing your service? It sounds like a lot of code for something that should be really simple or is not?

12

That was basically all of the code. I just place it in a service so I can call it from any controller. Here’s my service (without all unrelated code):

app.service('sharedFunctions', function($state, $ionicHistory) {
    return {
        goHome: goHome
    };

    function goHome() {
        $ionicHistory.nextViewOptions({
            disableAnimate: true,
            historyRoot: true
        });
        $state.go('home');
    }
});

Then in my controller:

app.controller('MainCtrl', function($scope, sharedFunctions) {
    $scope.sharedFunctions = sharedFunctions;
});

And in my html I have a button that calls it:

<button class="button button-clear" nav-direction="none" ng-click="sharedFunctions.goHome()"><i class="icon ion-home"></i></button>

When you go from the login state to the home state it keeps the login as a back view, so even if you disable the back button it won’t show the menu because the back view exists (if you have enable-menu-with-back-views=“false” on your sidemenu). The menu-close directive resets the navigation stack when placed on an item in your sidemenu, so that is all I am doing when going to the home state of my sidemenu. I’m not sure if there is a better way to do this, but it works for me.

3 Likes
13

Thanks!
Quick one, when you do that does that reset your $scope variables that might have been previously loaded?

14

No, it doesn’t. :smile:

15

Yeap, just realized I was loading a view and datas after so it would not show until page reload… haha using resolve should help

Thanks for your help :slight_smile:

1 Like