display data in html with angular4

Question

i'm using angular 4 and springboot to build an app but i have a problem i want to display a count object in html and i don't know how this is my repository

@Query("select count (c) from Contact c")
    int getCountOfContact();

my service.ts

getContactCount(){
    return this.http.get("http://localhost:9090/contact/count")
      .map(resp=>resp.json());
  }

my component.ts

getCountConact(){
  this.dashboardservice.getContactCount().subscribe((data)=>{
    console.log(data);
  },(error)=>{
    console.log(error);
  })
}

how can i have the result in my component.html

Answer 1

What is the actual problem? Does your service returns the exptected result? If so, you should save it to a variable and then you can bind it in the html. component.ts

data: any;

getCountConact(){
  this.dashboardservice.getContactCount().subscribe((data)=>{
    this.data = data;
    console.log(data);
  },(error)=>{
    console.log(error);
  })
}

and html:

<div>
{{ result }}
</div>