Question

我正在使用把手查找帮助器根据索引查找数组中的对象。

不幸的是，我无法输出对象的属性。

HTML：

 <script id="entry-template" type="text/x-handlebars-template">
      <div class="entry">
        <h1>Employees</h1>
        <div class="body">
          <ul>
            <li> 1.Employee {{lookup this 0}}</li>
            <li> 2.Employee {{lookup this 1}}</li>
          </ul>
        </div>
      </div>
    </script>

    <div id="content">

    </div>

Javascript：

var employees = [ { name : 'Joe'}, { name : 'Bob'} ];

var source   = $("#entry-template").html();
var template = Handlebars.compile(source);

var html    = template(employees);

$('#content').append(html);

和jsfiddle：https://jsfiddle.net/sgu2mmdz/1/

这是一个简化示例，用于演示我的问题。我知道有简单的方法，所以通过使用每个帮助

输出名称

编辑：这是一个更新的jsfiddle版本，更接近我需要实现的目标：https://jsfiddle.net/sgu2mmdz/6/

Answer 1

您可以使用this.<index>.<property>直接访问数组对象。所以在你的情况下，从this.0.name获取名称来自employees数组中的第一个元素。这是更新的小提琴：https://jsfiddle.net/sgu2mmdz/3/

我希望这就是你想要的。当然，正如您在问题中提到的那样，也可以使用each完成。

另外，我建议您使用log来调试此类问题。它通常可以帮助您确定您做错了什么。

var employees = [ { name : 'Joe'}, { name : 'Bob'} ];

var source   = $("#entry-template").html();
var template = Handlebars.compile(source);

var html    = template(employees);

$('#content').append(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.10/handlebars.js"></script>

<script id="entry-template" type="text/x-handlebars-template">
      <div class="entry">
        <h1>Employees</h1>
        <div class="body">
          <ul>
            <li> 1.Employee {{this.0.name}}</li>
            <li> 2.Employee {{this.1.name}}</li>
          </ul>
        </div>
      </div>
    </script>

    <div id="content">

    </div>

使用Handlebars查找帮助程序访问数组和输出属性中的Object

1 个答案: