Ion-nav-back-button suddently disappeared

Hello everyone, I’m developing my second app with ionic and I’m facing this problem. When a go to details, in some cases the back arrow disappear and makes this detail view as the new main view, so if i click on the menu to go to the home view, it shows the arrow as it was the detail of the detail. Watching the inspector sting caching the old views.

Call on global controller:

  $scope.detail = function(a) {
    $state.go("app.detail", {id: a});
    event.preventDefault();
  };


  $scope.home = function(e) {
    $state.go("app.home");
    event.preventDefault();
  };

  $scope.selected = function(e) {
    $state.go("app.myselected");
    event.preventDefault();
  };

I find out that the problem isn’t when I call the detail from the home but calling a item on the menu (myselected), and then click to see detail of listed items, the arrow disappear, and this detail is the main view now, like it was another tab, but not using tabs.

This is the detail controller

.controller('detailCtrl',function($scope, $stateParams, $http, $ionicSlideBoxDelegate, $ionicNavBarDelegate) {


  $scope.myDetailsIndex = $stateParams.id;

  if(deviceInfo.isIPad)
  {
    $scope.contentWidth = 'cont-5';
  } else {
    $scope.contentWidth = 'cont-3';
  }

  var detalle = $.extend( {}, infoToSend);
  var relacionados = $.extend( {}, infoToSend);
  var ifIsFav = $.extend( {}, infoToSend);
  
  function detalleFunc() {
    detalle.url = url + "/movies/getFicha/"+$stateParams.id;
    $http(detalle).then(function(res){
      $scope.detalle =  res.data;

      jwplayer('detailsMainImage-'+$stateParams.id).remove().setup({ 
        file: res.data.urlmobile, 
        image: res.data.portada,
      });
    }, function(a){
      console.log('error response: ',a);
      getActualToken();
      detalleFunc();
    });
  }
  detalleFunc();

  function relacionadosFunc() {
    relacionados.url = url + "/movies/relacionados/"+$stateParams.id;
    $http(relacionados).then(function(resu){
      $a = chunk(resu.data, 3);
      $scope.mostviews = $a;

      $('.segmentEach').addClass('cont-'+$('.segmentEachWrapper:first>div').length);
      $ionicSlideBoxDelegate.update();
    
    });
  }
  relacionadosFunc();

  function getIfFav() {
    ifIsFav.url = url + "/fav/isfav/"+userInfo.info.id+"/"+$stateParams.id;
    $http(ifIsFav).then(function(resu){
      $scope.isfav = resu.data.favorito;
    });
  }
  getIfFav();


  $scope.doFav = function(e) {
    event.preventDefault();
    ifIsFav.url = url + "/fav/setfav/"+userInfo.info.id+"/"+e;
    $http(ifIsFav).then(function(){
      $scope.isfav = 1;
    });
  };
})

this is the config


.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider) {
  $ionicConfigProvider.views.maxCache(5);
  // Authentication code
  $ionicConfigProvider.backButton.text('');

  $stateProvider

  .state('app', {
    url: "/app",
    abstract: true,
    templateUrl: "templates/menu.html",
    controller: 'AppCtrl',
    authenticate: true
  })

  .state('app.home', {
      url: '/home',
      views: {
        'menuContent': {
          templateUrl: 'templates/home.html',
          controller: 'homeCtrl as videos'
        }
      },
      controller: 'homeCtrl as videos',
      authenticate: true
    })


  .state('app.detail', {
      url: '/detail/:id',
      views: {
        'menuContent': {
          templateUrl: 'templates/detail.html',
          controller: 'detailCtrl'
        }
      },
      authenticate: true
    })


  .state('app.myselected', {
      url: '/myselected',
      views: {
        'menuContent': {
          templateUrl: 'templates/myselected.html',
          controller: 'mySelectedCtrl'
        }
      },
      authenticate: true
    })

  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('app/home');
})

Hope someone can help.
Regards

Braian Mellor
Ionic new fan

i think it this happens if you make a page reload on the detail view --> in this case ionic loses the history stack.
But if your app navigation works correctly (maybe you have some failures in your routings and states) the main view should show the hamburger-menu icon as well.

I find out that the problem start when I click in menu item. The first menu item that I select shows the back arrow, the second one not. But not find out how to fix it :frowning:


  <ion-side-menu side="left">
    <ion-scroll style="width:100%;height:100%">
      <div class="menuUserInfo">
        <div class="menuUserPic" style="background-image: url(img/temp/userPicPort.png)"></div>
        <div class="menuUserMail">{{userInfo.email}}</div>
      </div>
      <div class="menuWrapper">
        <div class="list mainMenu">
          <div nav-clear menu-close class="item menuTopItem menuNotification" ng-click="home()">
            Inicio
          </div>
          <div nav-clear menu-close class="item menuTopItem menuNotification" ng-click="notification()">
            Notificaciones
          </div>
      </div>
    </ion-scroll>
  </ion-side-menu>

I just find out that the problem is with ng-click, if i change it to myclick and then make a directive for this

.directive('myclick', function() {
  return function(scope, element, attrs) {
    element.bind('touchstart click', function(event) {
      event.preventDefault();
      event.stopPropagation();
      scope.$apply(attrs['myclick']);
    });
  };
})

Solve my problem but the menu never close, even with the menu-close directive.

I’ll continue working on this, but ng-click is not the first time that make me get headache