CODEWITHSUNDEEP
angularjsbrowser-historyionic-framework
mfink
mfink

Reputation: 1380

Ionic Back Button Doesn't Hide after exhausting $window.history.back()

I have an ionic app that has a search template that has a form where you can query posts by keyword. I also have a service that returns the post(s) as a list on another view. All that is working well.

My search controller upon submitting the search form uses:

$state.go('app.search.results', {'searchId': hash});

so that I can have a unique url for that search. I needed this unique url to implement 'back' functionality so that if a user clicks on one of the posts in the list, after viewing the post if they decide to click back, they would get to see the results of the search still (by default they would be returned to the search form without any results anymore).

To allow for a back to search results I implemented a custom back button function and put it on the ionic back button element like this:

<ion-nav-back-button ng-click="goBack()">

and then setup a the custom function:

$scope.goBack = function() {

    $window.history.back();

}

All of this works well, I can go back to search results and see them, essentially very much like normal browser back functionality.

Problem for me is that when I have gone all the way 'back' via the back button, my initial state contains the 'Back' button and clicking it does not go anywhere and the 'Back' button still shows. Ionic does pretty good about hiding the back button when it shouldn't be there but in this case not so. Any ideas for how to check when history is exhausted and hiding the back button conditionally would be appreciated.

EDIT:

Here is a jsFiddle ; Note: open fiddle in a new, separate tab to see back button issue. FYI Search is in the menu.

Upvotes: 0

Views: 764

Answers (2)

Mavlarn
Mavlarn

Reputation: 3883

You use $window.history.back(), I think you should use $ionicHistory.goBack(); instead. It can control the history and view and state in the ionic way.

Upvotes: 0

Jacob Carter
Jacob Carter

Reputation: 711

One of the few qualms I have with Ionic is their "smart" navigation. I have run into a lot of problems with this myself. My solution was to create a back button of my own, this back button stores previous states and their params so you can go back and not lose search results for example with your scenario.

This component gives you both a back button and breadcrumbs to use (or you can just use back button)

It is open source and feel free to use it!

jscBreadcrumbs

Strange Milk - Breadcrumbs Post

Here is your jsFiddle with the jscBreadcrumbs implemented and working:

jsFiddle

jscbreadcrumbs

Upvotes: 1

Related Questions