0

I get a result in the JSON Format like these sample from a webservice. How can i iterate over this items to prensent the objects

HTML Code - not working

<div *ngFor="let item of List">
  {{item.Code}}
</div>

JSON Sample

"List": {
  "0": {
         "Code": "A"
       },
  "1": {
         "Code": "B"
       },
  "2": {
         "Code": "C",
       }
  }

unfortunally the webservice does not provide this as an Array [] of objects

I want to see the list of all items für the Key "Code"

2 Answers 2

3

You can use KeyValuePipe like here.

So the your code would be something like this:

<div *ngFor="let item of List | keyvalue">
  {{item.value.Code}}
</div>
Sign up to request clarification or add additional context in comments.

2 Comments

Thanks - but with "let item in List" I get no results. With "let item of List" I get results. I get an output for "item.keys" but I can not access item.value.Code. Typescript raises an Error. and for item.value I only see [object Object]
Yes, you have to use let item of List. I made a mistake there and edited the answer.
0

As it was not working with

<div *ngFor="let item of List | keyvalue">
  {{item.value.Code}}
</div>

Typescript was throwing an error because {{item.value.Code}} was not known.

I did some additional research and found the following solution

<div *ngFor='let key of objectKeys(List)'>
  {{List[key].Code}} 
</div>

in the typescript class corresponding to the html file you have to add

objectKeys = Object.keys;

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.