Menu
Is there a way to determine when an ionic 2 page has fully loaded? I need to insert some html into the page when all of the page html has been loaded. Ideally I would like to have a function in my @page class that runs when the page has been loaded.
At the moment I am inserting an iframe containing a vine into a div container. I am experiencing, when running the app on an iPhone 5 running iOS 9, some peculiar behaviour where the same vine sometimes sizes to the container and sometimes doesn't. I am guessing that this might be due to timing (the source for the vine iframe is received as part of an http request).
914
Method 1: Using onload method: The body of a webpage contains the actual content that is to be displayed. The onload event occurs whenever the element has finished loading. This can be used with the body element to execute a script after the webpage has completely loaded.
We can set the window. onload method to a function we want to run code when the page is fully loaded. This is because window. onload runs when the page is fully loaded.
map(url => false); // Iterate over the images urls. forEach((url, index) => { // Create an HTML image let img = new Image(); // Listen to its loading event img. onload = () => { // Image has loaded, save the information this. haveImagesLoaded[index] = true; // If all images have loaded, set your loader to false this.
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.
You can use the ionViewDidLoad method:
@Page({
templateUrl: 'build/pages/somepage/somepage.html'
})
export class SomePage {
constructor() {
// ...
}
ionViewDidLoad() {
// Put here the code you want to execute
}
}
The lifecycle events as November 18, 2016 are:
Since Ionic 2 is in active development, things change all the time. If you would like to check the current lifecycle events, please refer to: https://ionicframework.com/docs/v2/api/navigation/NavController/#lifecycle-events
137
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
