Nav Bar / Back Button / Nav Clear Issues

[jeffsawatzky]

I have found a couple issues with the ion-nav-bar/ion-nav-back-button/nav-clear. I'm not sure if they are related or not, so I will describe them both

First issue - Sometimes the back button isn't visible when it should be

See this codepen

And follow these steps:

1. Open menu
2. Click "Account"
3. Click "Account Sub"
4. Notice the "Back" button
5. Click "Back"
6. Open menu
7. Click "One"
8. Open menu
9. Click "Account"
10. Click "Account Sub"
11. Notice the "Back" button is now missing

The "Account Sub" link does not have a nav-clear, so the navigation history should not get cleared.

Second issue - Sometimes the back button is visible when it shouldn't be

See this codepen

And follow these steps:

1. Click "Nav 1"
2. Click "Nav 2"
3. Click "No Nav"
4. Click "Nav 2"
5. Notice the "Back" button is there when I don't think it should be

The "No Nav" has a nav-clear, so shouldn't the nav-bar history be removed? Also, the ion-nav-bar is completey removed when going to "No Nav" so I would expect that the ion-nav-bar history would be cleared.

[perrygovier]

Hey @Niltz, thanks for the detailed description.

For the second issue, that's the appropriate behavior. Each tab group have their own unique history. So if Nav 1 and 2 are both in the same group and I go back to Nav 2, in that history, I'm still on the "detail" view of nav 1, which is what it considers nav 2 and is therefore showing a back button. I may have botched that description, did that make sense?

The first issue appears to be a bug though.

[perrygovier]

This may be related to ticket #1287

[jeffsawatzky]

@perrygovier, my second issue doesn't use tabs, so I don't know why tab groups would have anything to do with this.

Also I don't use location:'replace' so, I'm not sure if this is related to #1287.

[perrygovier]

Good point, I shouldn't have said tabs. The feature is commonly used in tabs, but it's the wrong term. The proper term is escaping me right now, but in:

  .state('nav.nav1', {
    url: "/nav1",
    views: {
      'navContent' : {
        templateUrl: "nav1.html"
      }
    }
  })

'navContent' sets what "group" that state belongs to, so nav.nav2 and nav.nav1 are considered related and will share a history.

[jeffsawatzky]

sibling states perhaps? So, why doesn't nav-clear in nav.nav2 work? Shouldn't that clear the current nav-bar's history before navigating? Or maybe I don't understand what nav-clear is supposed to do.

[perrygovier]

I'm not really sure. I'm not the best at the router and how it work with the inner workings of the parallel histories. @ajoslin might be a little more well spoken on the topic than I.

[jeffsawatzky]

Regarding my second issue (where the nav-clear directive doesn't seem to hide the back button), looking at the navClear directive in Ionic, it has the following code:

unregisterListener = $scope.$on('$stateChangeStart', function() {
    $ionicViewService.nextViewOptions({
        disableAnimate: true,
        disableBack: true
    });
    unregisterListener();
});
$window.setTimeout(unregisterListener, 300);

maybe in some cases the $window.setTimeout is called to soon and the back button doesn't get disabled? I don't know. I'm pretty new to AngularJS, UI Router, and Ionic so I don't know where responsibilities lie, but I thought the ion-nav-bar history and back button was part of Ionic, and not the ui router.

Maybe we are getting confused with "nav-bar history"? I'm not talking about the browser navigation history. I'm talking about the ion-nav-bar directive, it's history, and the ion-nav-back-button directive.

[Ionitron]

Greetings @Niltz!

Sorry but this issue may no longer be applicable to recent versions of Ionic.

If you are still experiencing this issue, please feel free to reopen and provide the following information so that I may assist you.

• Can you provide a detailed description of this issue?
• How would a robot go about replicating this issue?
• What platform does this happen on? (iOS, Android, all, etc.)
• What platform versions does this happen on? (Android 4.2, iOS 7, all, etc.)
• Is this an issue with the Ionic Framework, or Ionic CLI?

Additionally, providing a codepen which replicates the issue is extremely helpful.

If you wish to get help using the framework itself, the recommended place is the forum.

Thank you for allowing me to assist you.