外側の配列をループして列にデータを入力し、ネストされた配列をループして各列に行を作成する nunjucks テンプレートを作成しようとしています。
したがって、私のデータ構造は次のようになります。
var data = [
{
'type' : 'fruit',
'list' : ['banana', 'kiwi', 'strawberry']
},
{
'type' : 'vegetables'
'list' : ['tomato', 'carrot', 'zucchini']
}
]
次のような html ドキュメントを作成したいと考えています。
<div>
<span>fruit</span>
<ul>
<li>banana</li>
<li>kiwi</li>
<li>strawberry</li>
</ul>
</div>
<div>
<span>vegetables</span>
<ul>
<li>tomato</li>
<li>carrot</li>
<li>zucchini</li>
</ul>
</div>
次のような nunjucks テンプレートを作成してみました。
{% for category in data %}
<div>
<span>{{category.type}}</span>
<ul>
{% for thing in category.list %}
<li>{{thing}}</li>
{% endfor %}
</ul>
</div>
{% endfor %}
しかし、何らかの理由で、内部変数にアクセスできません。内側の for ループに実際にアクセスすることはできません。スタック オーバーフローとそのドキュメントを確認しましたが、ネストされた for ループについては何も見つかりません。
どんな助けでも大歓迎です。ありがとうございました。