Accessing nested object in html for angular

Question

I have a data structure that looks like this:

app_list = ["app_1", "app_2"]
data["results"] =
{
    "app_1": [
        {"key":1},
        {"key":2}
    ],
    "app_2": [
        {"key":1},
        {"key":2}
    ],
}

And would like to display it with this html code:

<div *ngFor="let app of app_list" >
    {{app}}
    <pre>
        {{data?.results?.app | json}} #This line
    </pre>
    <div *ngFor="let item of data.results.app">
        {{item}}
    </div>
</div>

But the json object I have set as "This line" seems to not render anything. This also means that the subsequent ngfor loop also does nothing. Am I doing something wrong here?

Whats a better way to do this?

What is the value of results ? you should probably write data["results"] =... — Olivier Boissé
– Olivier Boissé, Commented Mar 31, 2021 at 19:33
editted. I missed the " it seems there. Not in my code though, just in the post as I typed it manually. — ScipioAfricanus
– ScipioAfricanus, Commented Apr 1, 2021 at 17:35

Nadhir Falta · Accepted Answer · 2021-03-31 19:31:43Z

3

It should be something like this:

<div *ngFor="let app of app_list" >
        {{app}}
        <pre>
            {{data?.results[app] | json}} #This line
        </pre>
        <div *ngFor="let item of data.results[app]">
            {{item}}
        </div>
    </div>

answered Mar 31, 2021 at 19:31

Nadhir Falta

5,2872 gold badges25 silver badges43 bronze badges

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

5 Comments

ScipioAfricanus Over a year ago

Hey that worked! I tried it the first time and it failed.. I might have had a typo somewhere. Thanks!

Nadhir Falta Over a year ago

@ScipioAfricanus great! can you please mark it as the correct answer

ScipioAfricanus Over a year ago

Yeah there is a cool down I have to wait a bit

Nadhir Falta Over a year ago

@ScipioAfricanus just out of curiosity, what's a cool down ?

ScipioAfricanus Over a year ago

hmm not sure, 1 hour or so I think.

Collectives™ on Stack Overflow

Accessing nested object in html for angular

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related