Create Dynamic number of html.summary inside html.div using for loop

Hello All, I am creating a navigable dropdown tree where the data populates from JSON data. I am following this link.

Now, I want to create multiple html.summary inside html.div by iterating through lists from the JSON.

I tried this but got TypeError: Object of type 'generator' is not JSON serializable

                                            html.A(id=f"{portfolio}-link", children=[f"{portfolio}", html.I(className="far fa-arrow-alt-circle-right", id=f"{portfolio}-icon-1", style={'padding-left': '2px', 'color':'#C7C7C7'}),]),
                                        )for portfolio in portfolio_list

This chunk

    html.Summary(...) for portfolio in portfolio_list

is creating a Python generator expression, see here for a bit of background on what they are. Crucially a generator expression is different to a list comprehension which is what I think you want instead. You should be able to fix it just by adding some square brackets

    [html.Summary(...) for portfolio in portfolio_list]

Thanks a lot! That works!

1 Like