Problem displaying data in an observable

Ionic Framework ionic-v3
1

Hello, I can not display my data in the view.

I have an http call that returns an object.

I try to print "console.log(“getProfile: " + JSON.stringify(body))” of the object and it tells me that it is undefined but if after loading the page I put a button (console.log("getProfile: " + JSON.stringify(body)) and it prints the object well.

provider - profile.ts

 getProfile(): Observable<UserClass>{

   return this.http.get(this.path).map(
     (res) =>{
       let body = res.json();
       console.log("getProfile: " + JSON.stringify(body))
       return body;  
       //return this.data = res.json();  
        }, error => {
            console.log(JSON.stringify(error.json()));
        });
  }

component - profile.ts

LoadProfile():void {
/let obj = new UserClass(this.email, this.displayName, this.animalName, this. description,this. location );
this.profile.push(obj);/
this.ProfileService.getProfile().subscribe(
(userClass) => this.profile = userClass
)
}

Model - UserClass

export class UserClass {

    email: string;
    displayName: string;
    animalName: string;
    description: string;
    location: string;

    constructor(email: string , displayName: string, animalName: string, description: string,  location: string){
        this.email = email
        this.displayName = displayName
        this.animalName = animalName
        this.description = description
        this.location = location

    }

    getEmail(): string {
        return this.email;
    }

    setEmail(email: string){
            this.email = email;
    }

    getDisplayName(): string {
        return this.displayName;
    }

    setDisplayName(displayName: string){
            this.displayName = displayName;
    }

    getAnimalName(): string {
        return this.animalName;
    }

    setAnimalName(animalName: string){
            this.animalName = animalName;
    }

    getDescription(): string {
        return this.description;
    }

    setDescription(description: string){
            this.description = description;
    }

     getLocation(): string {
        return this.location;
    }

    setLocation(location: string){
            this.location = location;
    }

}

view

…

{{displayName}}

...
2

does it work if you place the console.log inside of the subscribe method in profile.ts?