Back navigation


#1

Hey peeps,

First time posting here…
Alright, I’ve spent far too long trying to circumvent/hack the problem I’m having. Basically it is this:
I have Page1, Page2, and Page3. Page1 is basically a list of items which can be clicked and you go to Page3 (the details page). On Page1 there’s an overlay (popover) which contains a button that when pressed will navigate to Page2. Page2 is a settings page for Page1, e.g. you can setup up filters of what to show on Page1. After updating filters I navigate Back (pop) to Page1. Here’s my problem:
Page1 should refresh only when I’ve navigated back from the settings page (Page2) or first time I navigate to this page.

I’ve tried many solutions:

  • Using events (the obvious solution): Page2 emits an event upon change and Page1 listen to this event, however, using a loading controller (loader/spinner), I get an exception on Page1 and apparantly there’s no workaround for this.
  • You can’t communicate on back navigation (pop), but I’ve found another solution: you pass a parameter from Page1 to Page2 which can be manipulated by Page2 such that Page1 can respond appropriately. However, I haven’t gotten this to work, since getting the parameter on Page2 always is undefined.

src:
Page1:

presentPopover(theEvent: any) {
    let popover = this.popoverCtrl.create(BrowsePreferencePopoverPage, {
      callback: () => {
        this.navigateToSettings();
      }
    });
    
    popover.present({
      ev: theEvent,
    });

  }

  public navigateToSettings() {
    let obj = { param: "johnny" };
    console.log(obj);
    
    this.navCtrl.push(EventsBrowseSettingsPage, obj);
  }

The callback is called in the Popover and navigate’s correctly to Page2 (EventsBrowseSettingsPage), however, the paramter “obj” is undefined in at Page2, what gives?


#2

Might help if you build a small demo and push to github?
kind of hard to follow without looking at a bigger picture.