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.
Related
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.
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
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.
I am wondering why binding a button inside the Loaded event in WPF page does not work and will only work after navigating to another page, and going back.
I have an inventory app and on the main page, most of the ViewModel are called because of a Back button which goes back to a specific lists and what causes that is, it will start binding the even if that command is not for that page and it will also load the collections for other pages.
So I used Loaded page event to call the necessary methods to populate the lists and also start binding commands for this specific page. I also used Unloaded page event for clean up like unsubscribing to some CRUD events.
The problem now though is, buttons does not get binding in Loaded page event. I do not know why..
I have made a miniature app to demo the problem. It can be downloaded here
(full source code included)
https://www.dropbox.com/s/qzumzyicuvrktsi/ICommandTest.zip?dl=0
This is because your views are not getting notified about the change of Command_ShowAddWindow and Command_ClickMe. Let me explain:
When your Page constructor is first run the bindings to your commands are initialized and transferred to the view, but by that time your commands are null, so the view binds both buttons' commands to null.
Then when your Loaded event is fired the commands are initialized, but the view is not getting notified about it, so it keeps command bindings to null.
The solutions to the problem are:
You manually call RaisePropertyChanged to notify the view about commands change when you initialize them:
void InitCommands()
{
Command_ShowAddWindow = new RelayCommand(Command_ShowAddWindow_Click);
Command_ClickMe = new RelayCommand(Command_ClickMe_Click);
RaisePropertyChanged("Command_ShowAddWindow");
RaisePropertyChanged("Command_ClickMe");
}
Or you initialize your commands in your ViewModel constructor before DataBindings are initialized:
public ViewModel_Page1()
{
InitCommands();
...
}
I have few components in a view and I am disposing them by clicking on a hyperlink as below -
toolkit.dispose();
form.dispose();
imageHyperlink.dispose();
Before disposing I appended a line to add components named Browser as -
browser = new Browser(parent,0)
browser.setUrl("www.....com");
The components are getting disposed properly, but to find the browser, I need to restore the view,means I need to double click on the view tab, then only the browser URL is coming up.
How to resolve this scenario.
I got a work around to solve the above. Since the after dispose, the view was expecting restore to refresh again, so I appended the size of the view every time after each refresh like this -
parent.setSize(getViewSite().getWorkbenchWindow().getShell().getSize());