Make API call before page load

Hi I am retrieving profile information from an API. I have a tab interface and when the profile tab is clicked for the first time, I am returned with error from the API and when I go back to other tab and revisit the profile tab, the data is fetched and displayed. Here is my profile.ts

import {Component} from '@angular/core';
import {apiCallService} from '../../providers/apiCallService';
import {Platform, NavController} from 'ionic-angular';

  templateUrl: 'build/pages/profile/profile.html',
  providers : [apiCallService]
export class profileMain {

	public name: string;
	public loadStatus: string;

  constructor(private apiCall : apiCallService, private platform : Platform) {

            data => {
       = data.json().display_name;
            err => console.log(err)


Any chance the changelog is relevant, specifically the bit in beta 8 where lifecycle events were renamed?

I changed onPageWillEnter() to ionViewWillEnter() but still the same

@anbumps in your case the ionViewWillEnter lifecycle hook is running before class constructor, So therefore you are getting error.
Use ionViewLoaded or ionViewDidEnter to solve this issue.

Still no luck. the http call is only made after I enter the page and the UI is displayed blank but when I go to other tab and come back, it works fine. I need to process the http request before loading my UI

@anbumps did you solve this, i have someone similar after upgraded to rc0, if ask if the var has data so i don’t get an error but the data is loaded after the form is rendered

I have a same trouble. Could you resolved it? Can you help me, please? @anbumps

I think the best solution here is to initialize your properties with some dummy value and use a loading spinner if desired.

1 Like

ionViewCanEnter returns a promise, if resolved successfully then the page is rendered, otherwise the transition does not happen.

See the code in the plunker I have attached


Great! You help me a lot! Thanks man!

Thanks @aaronksaunders - that is exactly what I was looking for!