NativeScript: Routing breaks when using Frame.goBack(to: BackstackEntry)

Tell us about the problem

Lets say we have an app that consists of 4 pages, and lets name these pages page1, page2, page3 and page4. And lets say that we have navigated from page1 to page4, visiting page2 and page3 along the way.

Now, I wish to go back to page2 using Frame.goBack(to: BackstackEntry) by looking up page2 this way frameModule.topmost().backStack[1]. Then if I try to navigate to page3 nothing will happen. Navigating back to page1 works, but navigating forward still doesn’t work.

If, instead of navigating to page2, I navigate to page1 or page3, routing will not break.

Which platform(s) does your issue occur on?

Both

Please provide the following version numbers that your issue occurs with:

CLI: 2.5.0
Cross-platform modules: 2.5.2
Runtime(s): iOS and Android: 2.5.0

Please tell us how to recreate the issue in as much detail as possible.

I have created a sample app that reproduces this issue: https://github.com/abinici/ns-goback-issue

About this issue

Original URL
State: closed
Created 7 years ago
Comments: 16 (4 by maintainers)

Most upvoted comments

Hi @tsonevn,

I tried your suggestion, when navigating from page2 to page3, but then my back navigation button disappears on page3, which prevents the user from navigating back to page2.

What I am trying to accomplish, is that the pages that the user navigates to, such as page2, page3 and page4, should all be put on the stack so that user is not prevented from navigating back from page4 to page3 and page2.

But when hitting a button on page4, I would like the user to be taken back to page2 without having to visit page3.

The function I am looking for is something like popToRoot in Ionic2: http://ionicframework.com/docs/v2/api/navigation/NavController/#popToRoot

You use setRoot() to set a root for the current navigation stack. And when calling popToRoot() you go back multiple levels in your page hierarchy.

Currently, I am forced to use Frame.goBack(to: BackstackEntry) and then I have to call pop() x times in this.routerExtensions.locationStrategy, to keep things in sync (I have added a pop-method to NSLocationStrategy). Obviously, this is an ugly hack, but I dont know the implementation well enough to make things the pretty way.

Maybe you could give me some directions so that I or someone else could implement this functionality in a PR, with something like back(steps: int) or back(url: string)?

abinici on Mar 28, 2017

@tsonevn actually this is a valid issue in {N} and not only nativescript-angular I want to do the same, i tried using clearHistory. Now the issue is that it moves back to the selected page but it loses the page state. I think the issue is that if the root page is already the one we are navigating to, {N} recreates the page instead of just closing all other in front. so if you do:

start in page1
change the state of page1
go to page2
go to page3
go to page1 using clearHistory => you go back to page1 but it recreates it and you loose the page 1 state

farfromrefug on Mar 27, 2019

Is there any indication when this feature will be available? We would also really like to use it instead of using tricks with the clear history and self made back buttons or other hacks to get it to work as intended

cindy-m on Jan 29, 2018

Need same feature like @abinici 😃

phattranky on Apr 24, 2017