尝试使用Nunjucks从JSON构建无序列表时，HTML输出为空

Question

我是nunjucks的新手，我目前正在尝试制作一个从JS数组构建无序列表的元素。如果有人可以解释我在做什么错，我会喜欢的。

下面的代码仅输出一个空白的<ul>元素。

下面的HTML代码

<div class="container">
    <div class="row">
        <div class="col py-2 my-2">
        {{ itemLine(shoppingItemArray) }}
        </div>
    </div>
</div>

<script>
    var shoppingItemArray = [{
        "1": {
            date: "23.03.2018",
            price: "800",
            receipt: "url"
        },
        "2": {
            date: "24.03.2018",
            price: "500",
            receipt: "url"
        }
    }]
</script>

下方的Nujujucks元素

   {% macro itemLine(shoppingItemArray) %}
        <div class="card my-2 px-4 py-3">
            <ul>
            {% for item in shoppingItemArray %}
            <li>{{item}}</li>
            {% endfor %}
            </ul>
        </div>
    {% endmacro %}