I can't print values of an object in Angular/html script

Question

I created service and component for listing objects in Angular. And list is working corretcly (I tried with 'console.log()'). But nothing appears when I try to print them in localhost:4200.

<table>
  <tr *ngFor="let py of list">
    <td>{{py.name}}</td>
  </tr>
</table>

("list" is an object array created with http get)

Also, my html component works fine, so it works when I write simple lines with <h1></h1>. And my object is not empty so if I change {{py.name}} part to {{py}}, I can see [object Object] in localhost. Can you help me to solve my problem?

I'm using vs code as IDE and here is my Angular version and ect:

Angular CLI: 12.1.1

Node: 14.17.3

Package Manager: npm 6.14.13

OS: win32 x64

AliF50 · Accepted Answer · 2021-07-16 12:54:01Z

3

Maybe you're console.loging at a point when the object is undefined.

To see the object's value in the HTML, you can take advantage of the json pipe.

Try this in your HTML:

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

Also, you can't use *ngFor for an object I don't think, you usually use *ngFor for an array.

answered Jul 16, 2021 at 12:54

AliF50

19.1k2 gold badges29 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

lyfearde Over a year ago

Thank you for your answer. I forgot to mention but list is an object array.

lyfearde Over a year ago

I used json and I can see my object's all values. But I need to print only name of the object.

AliF50 Over a year ago

Ok, your HTML seems fine to just print the name. It doesn't work?

lyfearde Over a year ago

I solve the problem. Problem was just discrepancy between database column names and angular model variable names. I didn't think about this simple case..

Collectives™ on Stack Overflow

I can't print values of an object in Angular/html script

1 Answer 1

4 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Related