$ionicHistory.goBack() not working?

1

Hey,

I’m creating a very simple App with a “Go back” button, to go back to the previous view.

I tried using $ionicHistory.goBack() just like specified in the documentation, but I can’t seem to get it working.

Here is my code:

<button class="button button-block button-assertive" ng-click="goBackHandler()">
   Go Back
</button>

And the controller code:

angular.module('starter.controllers', ['ionic'])

.controller('AppCtrl', function($scope, $ionicHistory) 
{
    $scope.goBackHandler = function()
    {
        $ionicHistory.goBack();                           //This doesn't work
        //window.history.back();                          //This works
        //alert('code to go back called. Did it work?');  //For testing
    }
});

This should be textbook - What could I be doing wrong?

Here is a plunker - http://plnkr.co/edit/yJqdfs?p=info

2

same with me before, but right now i am use like this:

.controller('NavigationCtrl', function($scope, $location, $ionicHistory){
        $scope.myGoBack = function() {
	       $backView = $ionicHistory.backView();
	       $backView.go();
        };
        $scope.go = function ( path ) {
	       $location.path( path );
        };
});

Hope this work in your code too.

1 Like
3

Hey,

thanks for the help. I tried out your snippet but I’m afraid it also doesn’t work.

Upon inspecting, I see that $ionicHistory.backView() always returns null for me, even when I navigate between different views…

Now I’m trying to understand why.

Here is the updated Plunker with your code - http://plnkr.co/edit/tvXUXxseLxMiSgTugFP8?p=preview

4

Do you use left menu in your application? If true you may notice that directive menu-close will close menu and clear your history. Use menu-toggle instead of menu-close.

10 Likes
5

This works for me. Thanks

6

##Alex! you are a genius!

Thank you, also i add enable-menu-with-back-views=“true” in my menu to add back button into non direct childs of the navigation.

    <ion-side-menus  enable-menu-with-back-views="true">
      <ion-pane ion-side-menu-content>
        <ion-nav-bar class="bar-stable">
          <ion-nav-back-button class="button-clear"><i class="icon ion-chevron-left"></i> Back</ion-nav-back-button>
        </ion-nav-bar>
        <ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
      </ion-pane>

      <ion-side-menu side="left">
        <header class="bar bar-header bar-stable">
          <h1 class="title">Menu</h1>
        </header>
        <ion-content class="has-header">
          <ion-list>
            <ion-item nav-clear menu-toggle href="#/app/start">
              Home
            </ion-item>
            <ion-item nav-clear menu-toggle href="#/app/contact">
              Contact us
            </ion-item>
          </ion-list>
        </ion-content>
      </ion-side-menu>
    </ion-side-menus>
7

for me also $ionicHistory was not working
but in index.html ,
I was using
<ui-view></ui-view>
was not working
I replaced it with
<ion-nav-view></ion-nav-view>

its working fine now

<!DOCTYPE   html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">

    <meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src  'self' 'unsafe-inline' *">
    
    <title></title>

    
    
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="cordova.js"></script>

   <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyAPU3y59ihAELaLjTWMNg89cCwvb6K2L8Q&libraries=places"></script>
    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet">
    
    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    

    <style type="text/css">
      .platform-ios .manual-ios-statusbar-padding{
        padding-top:20px;
      }
      .manual-remove-top-padding{
        padding-top:0px; 
      }
      .manual-remove-top-padding .scroll{
        padding-top:0px !important;
      }
      ion-list.manual-list-fullwidth div.list, .list.card.manual-card-fullwidth {
        margin-left:-10px;
        margin-right:-10px;
      }
      ion-list.manual-list-fullwidth div.list > .item, .list.card.manual-card-fullwidth > .item {
        border-radius:0px;
        border-left:0px;
        border-right: 0px;
      }
    </style>
<!-- <script type=“text/javascript“ src=“http://maps.googleapis.com/maps/api/js?key=AIzaSyAPU3y59ihAELaLjTWMNg89cCwvb6K2L8Q&amp;libraries=places“></script> -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/routes.js"></script>
    <script src="js/services.js"></script>
    <script src="js/directives.js"></script>
    <script src="js/constants.js"></script>

 
  <!-- <script src = "lib/ngCordova/dist/ng-cordova.min.js"></script> -->

    <!-- Only required for Tab projects w/ pages in multiple tabs 
    <script src="lib/ionicuirouter/ionicUIRouter.js"></script>
    -->

  </head>
  <body ng-app="app"  controller="AppCtrl">
<!-- <ui-view></ui-view>   -->
  <ion-nav-view></ion-nav-view>
  <!-- <ui-view></ui-view> -->
  
  <!-- <script type=“text/javascript“ src=“http://maps.googleapis.com/maps/api/js?key=AIzaSyAPU3y59ihAELaLjTWMNg89cCwvb6K2L8Q&amp;libraries=places“></script> -->
   <!-- <script src="https://maps-api-ssl.google.com/maps/api/js?libraries=places"></script> -->
   
  </body>
</html>
8

If all else fails:

$scope.GoBack = function() {
$window.history.go(-1);
}

7 Likes
9

You are a Genius indeed!

10

Thank “U” :slight_smile:

11

thanks a lot you are helpful, it works great

12

$ionicGoBack()

<button class="button button-float" ng-click="$ionicGoBack()">
    <i class="icon ion-ios-arrow-back"></i>
  </button>
13

thank you very very very much…My problem is solved easily…thank you thank you thank you so much :grinning:

14

Heyy,I cant’ go back on press key on mobile…that time what I do…please suggest me

15

Thanks a lot! this save me, a lot of people seem to have the same problem.

16

Omg, this solved my problem very very easy. TKS