nativescript-angular: Routing breaks when using Frame.goBack(to: BackstackEntry)

From @abinici on March 21, 2017 20:39

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

Copied from original issue: NativeScript/NativeScript#3848

About this issue

  • Original URL
  • State: open
  • Created 6 years ago
  • Reactions: 2
  • Comments: 27 (13 by maintainers)

Most upvoted comments

For our app we depended on back navigation to a specific page in history without editing any of the core classes. It took a while to figure out the exact choreography of all events that are triggered, but this is the solution we came up with:

public navigateBackTo(depth: number): void {
  let largeBackStack: boolean = false;
  const arrayLength: number = this.routerExtensions.frame.backStack.length;
  this.routerExtensions.frame.backStack.map((backstackEntry: BackstackEntry, index: number) => {
    if (index > depth && backstackEntry.resolvedPage) {
      const page: any = backstackEntry.resolvedPage;
      setTimeout(() => {
        if (page.isLoaded) {
          page.onUnloaded();
        }
        if (index + 1 === arrayLength && !largeBackStack) {
          page.onNavigatedFrom(true);
        } else {
          largeBackStack = true;
          page.onNavigatedFrom(false);
        }
      }, index - depth * 100);
    } else if (index === depth) {
      this.routerExtensions.frame.goBack(backstackEntry);
    }
  });
}

We are still updating the code to move the check for largeBackStack outside the lambda method, but in the meantime this is a solution that works like a charm for us.

Hope this works for you guys as well

Any update or workaround on this feature?