我是Handlebars JS的新手,只是想了解它们。
我正在尝试在包含哈希数组的数据上实现车把。
这是我的脚本:
<div id="test"></div>
<script id="template" type="text/x-handlebars-template">
<h1>{{title}}</h1>
<h2>{{body}}</h2>
</script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0/handlebars.js"></script>
<script>
$(document).ready(function (){
var source = $("#template").html();
var template = Handlebars.compile(source);
var context = [{title: "ABC",body: "DEF"},{title: "GHI",body:"JKL"}];
console.log(context);
var ht = template(context);
console.log(ht);
$("#test").html(ht);
});
</script>
什么都没有显示在输出上
如何使用车把模板访问哈希数组。以上脚本中的前变量
context
。我们可以仅在散列上使用把手吗?
谁能给我解释一下。
谢谢
最佳答案
您可以使用{{#each}}帮助程序来遍历集合。在您的情况下,将是这样的:
{{#each this}}
<h1>{{title}}</h1>
<h2>{{body}}</h2>
{{/each}}
当然,我们只能在散列上使用它-试试吧。
您可能会发现阅读此文章很有用:http://handlebarsjs.com/builtin_helpers.html
我希望您的脚本标签看起来不像您的文章,并且实际上不缺少“ http”部分
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>