Question

我正在使用PHP-backend，Backbone.js和Handlebars.js。我的javascript请求数据和JSON数据成功返回（json_encode）。

当我将此JSON数据提供给车把模板时，它不会显示。我意识到我的JSON对象的前面和后面的方括号被Handlebars.js“不喜欢”而没有被显示。看看下面的代码。

var ArticleListView = Backbone.View.extend(
{
  el: $('#main'),
  render: function()
  {
    var template = Handlebars.compile($("#articles_hb").html());
    $(this.el).html(template([{"articles":[{"title" : "1"}, {"title" : "2"}]}]));
    return this;    
  }
});

现在，如果我取出括号，它可以正常工作。这是怎么回事？为什么方括号出现在那里？我如何摆脱它们？

Answer 1

调用Handlebars循环访问集合的输出是完全合理的。对于视图中的数据处理，数组也不是一个糟糕的设计决策。

Handlebars具有处理数字或符号标识符as described here的特殊语法。因此，更正确的答案是Handlebars可以访问模板中的数组：

{{people.attributes.[0]}} // akin to people.attributes[0]
{{people.attributes.[1]}} // akin to people.attributes[1]

输入：邮件：[{headers：{subject：[“Hello Darling”，“... another”]}}，...更多]

<ul>
  {{#each mails}}
    <li>.
        {{headers.subject.[0]}}
    </li>
  {{/each}}
</ul>

Answer 2

Handlebars想要一个上下文对象，因为它使用上下文作为模板值的简单查找表。因此，您需要将对象（{ ... }）传递给template()，而不是数组（[ ... ]）。

有人给你一个包含你需要的上下文对象的单元素数组。修复生成JSON的PHP以发送JSONified对象（PHP术语中的关联数组），而不使用数组包装器或在客户端代码中删除数组，如下所示：

$(this.el).html(template(context[0]));

如果你有这个文字代码：

$(this.el).html(template([{"articles":[{"title" : "1"}, {"title" : "2"}]}]));

在您的JavaScript文件中，您必须生成该代码并修复它。如果您确实拥有嵌入在Backbone视图中的文字数据，那么您可能没有正确使用Backbone，模板的数据应该来自Backbone模型。

如果您从Backbone模型中获取JSON，那么我猜您在集合（返回数组）上调用toJSON而不是toJSON应该在{{3}}给你一个JavaScript对象。

Handlebars.js不喜欢前面的方括号

2 个答案: