Error. Uncaught (in promise): Error: No provider for Content!

Ionic 3.
I try to use auth-servise in file home.ts:

import { Component } from ‘@angular/core’;
import { NavController } from ‘ionic-angular’;
import { AuthServiceProvider } from ‘…/…/providers/auth-service/auth-service’;
import { WelcomePage } from ‘…/…/pages/welcome/welcome’;

@Component({
selector: ‘page-home’,
templateUrl: ‘home.html’
})

export class HomePage {

public userDetails : any;
public responseData: any;
public dataSet: any;

userPostData = {“user_id”:"",“token”:""};

constructor(public navCtrl: NavController, public authService: AuthServiceProvider) {

const data = JSON.parse(localStorage.getItem('userData'));
this.userDetails = data.userData;
console.log(this.userDetails);

this.userPostData.user_id = this.userDetails.user_id;
this.userPostData.token = this.userDetails.token;

this.getData(); 

 }

getData(){	    
    
  	this.authService.postData(this.userPostData,'bodygraph').then((result) => {
		    this.responseData = result;
		     
		    if(this.responseData.bodygraphData){ 
		    	this.dataSet = this.responseData.bodygraphData;
		        console.log(this.dataSet);			         
		    }
		    else{
		        console.log("No access");
		    } 
    }, (err) => {
      	// Error log
    });
    
}

}

I created PHP API.
And I got data.
But I have error in file home.html:

{{userDetails.name}} {{dataSet.age}} -ERROR HERE!!!!

Runtime Error
Cannot read property ‘age’ of undefined

I think that the file home.html opens earlier than I get the data.
I see it in console log:

Help me, please.

it is not “Age” undefined but the variable thats holds this property, before you try to access “Age” please console.log(object with Age property)

this.dataSet - object with Age property. And You can see on image that this.dataSet.age = “43 года”.
But I get an error log earlier than the data fall into this.dataSet. (See image).

if you are getting this.responseData.bodygraphData from an async call it might be unavailable in the place you are trying to use it at some point in time, do console.log(this.dataSet); just before you try to access “Age”

Thank you for help.But I don’t understand.
I want to get data and then open html. How can i get this?
I search examples.
I try 2 variants:

getData(){

this.authService.postData(this.userPostData,'bodygraph').then((result) => {
	    this.responseData = result;
	     
	    if(this.responseData.bodygraphData){ 
	    	this.dataSet = this.responseData.bodygraphData;
	        console.log(this.dataSet);			         
	    }
	    else{
	        console.log("No access");
	    } 
}, (err) => {
  	// Error log
});

}

and second variant:

getData(){

    var link = 'http://mylink.dev/api';
 	 
 	this.http.post(link, this.userPostData)
 	.subscribe(data => {
 		console.log(data); 
 		this.responseData = JSON.parse(data["_body"]);
 		if(this.responseData.bodygraphData){ 
	    	this.dataSet = this.responseData.bodygraphData;
	        console.log(this.dataSet);			         
	    }
	    else{
	        console.log("No access");
	    } 
 	}, error => {
 		console.log("Oooops!");
 	}); 	   
  	
} 

But I always have error. Although there are no errors in the examples.

  • Don’t abuse any like you are
  • Assign a viable value (generally empty {} or [] is sufficient) immediately every time you declare an object or array property