Ionic Lifecycle: ionViewDidLoad - ionic-framework

I'm using this hook on my Home to get and store some data for my app.
In many articles and tutorials over the net is been sad the ionViewDidLoad hook will fire only ONCE after the view is cached.
But I tested switching pages with navCtrl.setRoot then go back to Home...
The ionViewDidLoad is called again. Did I understand it all wrong? Am I doing it wrongly? I should put a "test" before my commands on ionViewDidLoad?
Any help or explanation for this...

ionViewDidLoad does get called only per page creation. This view is cached when navigation occurs through push() i.e this page is still there in the stack. If navigation happens back to this page via pop(), the hook is not called again.
You are currently using setRoot() to test. This will clear the navigation stack i.e all views are in the current stack are destroyed. The current view is also destroyed when you call pop() on the current page.
Check View Creation and Lifecycle hook section in the docs

Related

SAPUI5 Not clearing view after browser back button pressed

I have a 2 page app..
First time into the 2nd page, it performs the onInit() and works fine.
If the browser back button is hit and the 2nd page is entered into again onRouteMatched() is no triggered, the view is not cleared and this causes issues in that elements of the view are duplicated etc.
I've tried a number of things:
- Clearing the view model,
- Destroying the page on Exit,
- Duplicating onInit into onRouteMatched.
but nothing seems to work.
Reloading fixes the issue.
Any suggestions?
onInit() is only called once when the view is instantiated. It is generally used to modify the View before it is displayed, bind event handlers and do other one-time initialization.
.attachMatched(this.onRouteMatched, this) will trigger when the route is matched on re-navigating to that view.
For example you would have this in the onInit() section:
this.getRouter()
.getRoute(<views-route-name-here>)
.attachMatched(this.onRouteMatched, this);
EDIT
I see you did post some code in the comments section:
Makes sure your route name is "actionplan" in your manifest.json and that this is appearing after the hash. This should ensure a match and trigger the _onRouteMatched function in your case.
If this doesn't solve it can you expose your manifest.json.

Initializing component inside a home page in Ionic4

I have a Home Page, inside that I have created one component RecentlyViewedProductComponent.
My problem is:
when I navigate to /home by using
this.router.navigate(['/home']);
the ngOnInit() inside RecentlyViewedProductComponent is not working. When I close the app and open it again, that only it is working .
How to solve this problem?
It sounds like you are not using the right lifecycle event.
Have you looked at the documentation here:
https://ionicframework.com/docs/angular/lifecycle
It says that ngOnInit() is:
Fired once during component initialization. This event can be used to initialize local members and make calls into services that only need to be done once.
If you want it to be called every time you navigate to the home page then you want to replace this with something like ionViewWillEnter():
Fired when the component routing to is about to animate into view.
There is actually some guidance at the end of the docs page that you might find interesting which explains when to use each life cycle method.

Ionic- need an event after page is backed

I need an event of page which is backed.
IonWillEnter or ionViewDiEnter events aren't fired when page is backed.
Ionic framework seems to show page simply when a back button is clicked.
Would you like to teach me?
Sorry for my poor English.
Thanks
For your info.. Ionic 2 lifecycle method
ionViewDidLoad - works the same way as ngOnInit, fires once when the view is
initially loaded into the DOM
ionViewWillEnter and ionViewDidEnter - hooks that are available before and after the page becomes active
ionViewWillLeave and ionViewDidLeave - hooks that are available before and after the page leaves the viewport
ionViewWillUnload - is available before the page is removed from the DOM
You should use ionViewWillLeave / ioniViewDidLeave to track the page back/close event
According to https://ionicframework.com/blog/navigating-lifecycle-events/
ionViewWillEnter: It’s fired when entering a page, before it becomes the active one. Use it for tasks you want to do every time you enter in the view (setting event listeners, updating a table, etc.).
ionViewDidEnter: Fired when entering a page, after it becomes the active page. Quite similar to the previous one.
So you can use any of above. I prefer ionViewDidEnter more in this scenario so screen render faster if you call any API.

Template10 - return user to the main page after resuming

Let's assume that my UWP app gets suspended and it is not used for a long time. When a user opens the app again (previous ApplicationExecutionState is Suspended or Terminated), I don't want the user to be navigated to the page he/she was viewing last (it became irrelevant since then), but instead do a fresh navigation to the main page. How can I do this using Template10?
It seems that when the user returns to the app, Template10 always returns the user to the page which was being viewed last. I tried overriding the OnResuming method in App.xaml.cs, however it had no effect.
I had this problem.
I solved saving a bool property like ItWasSuspended in the LocalSettings of my app.
When the OnResumming is activated I set to True this property or when the launched event was raised I set this property false.
Finally in my pages in the OnNavigatedTo I get the value of this property if this property is true I navigate to the main page and I clear the back stack.
Here is how to use the local settings
https://msdn.microsoft.com/library/windows/apps/windows.storage.applicationdata.localsettings.aspx
you can clear the back stack doing something like this
this.Frame.BackStack.Clear();
please mark this answer if it's useful for you!
Best regards

Supress visible screen switching on iPhone

In the iPhone application I'm developing, I have a need to return the user to the previous screen they were using when, for instance, the application was interrupted by, say, a phone call.
The application is driven by a navigation controller, and the user may be several layers deep into the application. As such, I think that I need to traverse the navigation controller logic to bring the user to the point that they were previously at, with all return navigation logic n place.
I'm comfortable that I can force the application to navigate down to the required level through code, but I would like to hide the screen switching and animations that would occur while this is going on, thus presenting the user with (apparently) a direct path to their last used screen, rather than showing them the underlying navigation that's occurred.
Could somebody please point me to some method of suppressing the intermediate displays?
Does anyone have other methods to perform this sort of task?
Thanks in advance for all suggestions.
I suggest you take a look at the Three20 project which contains a feature called "URL-based navigation", which might help you, since you only should to store the URL of the current visible view controller, and restore it when the app resumes after the phone call:
TTNavigationCenter is for those grizzled old web developers like myself who want to organize their app by "pages" which can be displayed by visiting a URL.
Your view controllers can simply register URL patterns that they handle, and when those URLs are visited the controllers will be created and displayed. You can also register generic actions that are called when a URL is visited.
TTNavigationCenter also persists and restores the full path of navigation controllers and modal view controllers, so your users can quite the app and come back exactly where they left off.
(source: Three20 Github project)