jsrender在for迴圈中獲取上級資料
阿新 • • 發佈:2018-10-31
使用~root可以在模板中訪問到頂層資料,從頂層資料往下就可以訪問到所有資料了,如下:
<script id="item-list" type="text/x-jsrender"> {{for items}} {{if ~root.type == "pic"}} <tr> <td>{{:id}}</td> <td><img src="{{:pic}}" /></td> </tr> {{else ~root.type == "name"}} <tr> <td>{{:id}}</td> <td>{{:name}}</td> </tr> {{/if}} {{/for}} </script> <script type="text/javascript"> var picitems = [ {id:1, pic:"/images/1.png" }, {id:2, pic:"/images/2.png" }, {id:3, pic:"/images/3.png" } ]; var html = $("#item-list").render({ type: "pic", items: picitems }); $("#allitems").append(html); var nameitems = [ { id: 1, name: "/images/1.png" }, { id: 2, name: "/images/2.png" }, { id: 3, name: "/images/3.png" } ]; var html = $("#item-list").render({ type: "name", items: nameitems }); $("#allitems").append(html); </script>
jsrender對語法要求非常嚴格,比如for,if前面不能有空格
參考:
http://www.cnblogs.com/tangmingjun/archive/2012/06/04/2534605.html