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

时间:2016-07-01 12:40:51

标签: javascript arrays json json2html

我有以下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>

THX

1 个答案:

答案 0 :(得分:0)

您的转换应修改为:

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

注意thisthis.orders的更改,因为根变换引用了{orders: [...]}对象,所以在children函数中指定要用作的新数组是必要的。数据。

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