哈希数组上的车把 JS

Handlebars JS on Array of Hashes

本文关键字:JS 数组 哈希      更新时间:2023-09-26

我是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>

输出上不显示任何内容如何使用车把模板访问哈希数组。上述脚本中的 Ex- 变量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>