Notice: The Monaca & Onsen UI Community Forum is shutting down.
For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.
Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.
How to reload page on switching tabs in ons-tabbar
-
Hi,
We are trying to upgrade to onsenui 2 from onsenui 1.3.18 and the behaviour of ons-tab and ons-tabbar has obviously changed.
We have been relying on the fact that the pages are reloaded when a user changes from one tab to another.
I have found plenty of posts where people were asking for the opposite and it seems that this change was applied.
How can I force the page to reload and have the same behaviour as before version 2?
Just to be clear, we have scope variables in our page and we clear these when a user clicks to a new tab. Previously, when the tabs changed the values on the page changed also. Now the values do not reflect the scope variable values.
Thanks
-
@Vincent-Bastos The pages are not reloaded anymore and there is no option to do it. Perhaps you could try to move your logic to some event handlers. Check page events and tabbar events. I think
show
event could work.
-
That is disappointing - why the regression?
-
@Fran-Diox I just realised that the problem is not where the logic is because my function does get called to clear the scope variable. The problem is the actual reloading of the page.
Is it a matter of destroying the page?
-
@Vincent-Bastos My preferred method now is:
document.addEventListener("show", function(event){ if(event.target.id=='myPage') { // Clear your scope variables here or whatever } });
-
@munsterlander I don’t think this will work because the issue is not the variables. It’s the page that does not reload.
-
What about something like tabbar.loadpage(’/page/url.html’, [options.keepPage = false])?
I’m just unsure about the syntax to pass the option.
( I am using Angular JS 1 )
-
Ok I found the code for the loadpage function in the code, but I don’t know how to write this syntax.
https://github.com/OnsenUI/OnsenUI/blob/master/core/src/onsenui.d.ts#L691
-
@Vincent-Bastos Well, now the pages are always persistent, they are not removed and created again. We noticed this just made loading tabs way slower, so we made them persistent. Your Angular controller will be only run once at the beginning of the app. That’s why we recommended to put the code in
show
event instead, since it will be run every time you activate the tab (just like before).Using
loadPage
for this would just be a dirty patch, but if you are ok with that you can read the docs here.
-
This post is deleted!