CODEWITHSUNDEEP
javascriptangular
cfoster5
cfoster5

Reputation: 1826

Show entire object in template

Using Angular 5, I am trying to show all properties of an object.

With a collection of objects such as:

testobjects = [
    {"customer": "Me", "ID": "1"},
    {"customer": "You", "ID": "2"},
    {"customer": "Him", "ID": "3"},
    {"customer": "Her", "ID": "4"}
];

and with HTML:

  <div *ngFor="let testobject of testobjects">
    <span>{{testobject}}</span>
    <span>{{testobject.customer}}</span>
  </div>

I can get testobject.customer in the template but not testobject.

How can I show the entire object?

Upvotes: 0

Views: 80

Answers (4)

Nadhir Falta
Nadhir Falta

Reputation: 5257

You can also well format it using the pre tag:

<pre>{{testobject | json }}</pre>

Upvotes: 0

alsami
alsami

Reputation: 9815

Use the JSON Pipe.

<div *ngFor="let testobject of testobjects">
<span>{{testobject | json}}</span>
<span>{{testobject.customer}}</span>
</div>

Upvotes: 2

Shadab Faiz
Shadab Faiz

Reputation: 2508

Try this: {{testobject | json }}

Upvotes: 1

Narm
Narm

Reputation: 10844

You can use Angulars json pipe

<div> {{testobject | json }}</div>

Upvotes: 1

Related Questions