How to kill a page?

Ionic Framework
1

Hello guys,

I am using tabs in my ionic app… I have two tabs, when I click the 2nd tab, and click back to the 1st tab, the page is still there, and I want that, but when I click a certain button in the second tab, I want to kill that page.
How can I do this? I’m using router. Is there anyway to fix this?

Thanks

2

Can you back up and describe in non-technical terms what you mean by “kill that page”?

3

of course…

my problem:

In tab 1, I have a page called NewObject. That page is creating a new object and displaying it in the Tab2 page. I can edit the object (it goes back to the same page in Tab1) in the Tab 2. In the NewObject page I have a button delete. When I click the delete button I want that page to disappear, being the root a page called “Home” in Tab1. The problem here is when I edit the object when I come back to the Tab1, the NewObject page is still there because when I click the button I have to go back to the Tab2, so the TAB1 NewObject stays alive. How can I get rid of this link?

Is there anyway to solve this?

4

Probably, but I fear that tabs are not a good fit for this structure. Tabs are at their best when hosting self-contained “sub-apps” that are independent of one another (such as “menu”, “hours”, “order history”, &c for a restaurant app). I get that it appears initially seductive to wall off different functionality applying to the same business object in tabs - I’ve done this before also, but have found it does not hold up well from a UX perspective, aside from any technical trouble you’ve run into.

Without knowing more about what your business-level domain looks like, I can’t say much more concretely, but generally speaking I think my first instinct would be a breadcrumb summary/detail design, where you have a summary page that is capable of:

  • spawning new objects,
  • descending into existing ones by navigating to their detail page,
  • deleting unwanted objects

I would have the detail page take its notion of what constitutes “the currently focused object” from a service that is injected by both the summary and detail pages. The detail page could have a breadcrumb link back to the summary page (and also, if desired, a “delete this object” button that does the deletion and returns to the summary).

I believe this approach would design away the specific technical problem you’re having, as well as resulting in a more intuitive interface for the user.

1 Like
5

Thank you so much for your insight, I thought I was just being dumb by not being able to perform this. I started to use ionic about 5 months and I don’t have much experience.
Thank you