Search code examples
nativescriptangular2-nativescriptnativescript-angular

Nativescript: Page navigation working incorrectly with ModalDialogService using showModal


Issue - We have a close callback on showModal which should ideally navigate user to another page. However when a modal dialog box is closed, user is navigated back to base page instead of the page to be navigated.

So navigation which should work as Login -> Staff-list is working as Login -> Staff-list -> Login (back due to additional Child Route Processing)

Code to reproduce issue can be found at https://play.nativescript.org/?template=play-ng&id=lrIrYT&v=5

Steps to reproduce

  1. App launches on Home Screen
  2. Click on Login Tap
  3. Popup appears. Click on Select button.
  4. You should be routed to Staff page. (ideally) as per navigation.
  5. If you are routed to staff list page correctly, please click back and move to Home page and repeat steps from 1 to 4.
  6. Issue mentioned above should be reproduced.

Solution

  • As suggested by @Nickliev

    setTimeout(() => { this._routerExtensions.navigate(['/staff-list', '10']); }, 1)

    "I guess simple race condition where the close callback is (sometimes) being triggered before the route navigation (that goes back to home page). So, in this case, the modal is closed >> you are navigating >> the nativescript is navigating (too late). Using the setTimout guaranties that the code inside will be executed in the next javascript pass (VM related) and thus: modal closed >> nativescript navigation >> your navigation"