json2html - 为包含多个元素的数组中的 JSON 数据创建内联函数

json2html - Create inline function for JSON data in array w/ multiple elements

我有以下 JSON 数据:

{"orders":[
{"id":16,"status":"completed","total":"45.00"},
{"id":17,"status":"completed","total":"55.00"}
]}

如何使用 json2html 将此数据转换为 html? ${orders.0.total} 有效,但我希望它转换所有订单,而不仅仅是数组 0。

我已经尝试了 this answer 的解决方案,但它不起作用。

这是我的:

<body>
    <ul id="list"></ul>
</body>

<script type="text/javascript">
    //List items
    var myjson = [{"orders":[
                 {"id":16,"status":"completed","total":"45.00"},
                 {"id":17,"status":"completed","total":"55.00"}
                 ]}];

    //List item transform
    var orderTransform = {"tag":"div","html":"${total}"}

    var transform = {"tag":"div","children":function(){
        return( json2html.transform(this,orderTransform) );
    }};

    $(function(){
        //Create the list
        $('#list').json2html(myjson,transform);
    });
</script>

感谢

您的转换应修改为:

var transform = {"tag":"div","children":function(){
        return( json2html.transform(this.orders,orderTransform) );
}};

注意 thisthis.orders 的变化,因为根变换引用了 {orders: [...]} 对象,所以在子函数中需要指定正在处理的新数组用作数据。

原始代码将 this 作为子数据传递,这会使 json2html 尝试使用 orderTransform 重新呈现 {orders: [...]} 对象,这是不正确的,因此显式指定很重要该转换的数据在 orders 字段中。