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

Ionic Framework ionic-v3
1

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.

2

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)

3

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).

4

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”

5

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.

6
  • 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