display data angular 4

Question

Hi, please how can i display this console.log(data) in table using angular 4 Thanks,

Tushar Dikshit · Answer

hi, Assuming you are getting this data in component, assign the result you are getting in "data" to a array of class of type data.(defin a class with the fields you have in data) Then you can use *ngFor in html template. posting code snippet from recent development, if it helps //Component - import { Resource } from '../resource' ; @Component({ selector: 'emp-service-component' , templateUrl: '../app/htpservice/app.employee.view.html' Here is Resource class defined to hold one set of record of the employee. When you get data create array/collection of resources. resources: Array ; Getting data from service this .serv.getData().subscribe((resp: Response) => { this .resources = resp.json(); In html table class = 'table table-striped table-bordered' > thead > tr > td > EmployeeId td > td > FirstName td > td > LasteName td > td > Email td > td > Contact td > tr > thead > tbody > tr * ngFor = "let r of resources" > td > {{r.EmployeeId}} td > td > {{r.FirstName}} td > td > {{r.LastName}} td > td > {{r.EmailId}} td > td > {{r.ContactNumber}} td > tr > tbody > table >

Karthik Elumalai · Answer

Hope this link may help for you:https://stackoverflow.com/questions/44894942/returning-data-in-console-log-with-angular-but-not-displaying-on-html-page Thanks

display data angular 4

Answers (2)