Handlebars.jsは正面角かっこが好きではありません

Question

私はPHPバックエンド、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は、テンプレート値の単純なルックアップテーブルとしてコンテキストを使用するため、コンテキストのオブジェクトを必要とします。したがって、オブジェクト（{ ... }）をtemplate()に渡し、配列（[ ... ]）に渡す必要はありません。

誰かがあなたに必要なコンテキストオブジェクトを含む1要素の配列を与えてくれます。配列ラッパーなしJSONifiedオブジェクト（PHP用語で連想配列）を送信するためにJSONを生産しているPHPを修正するか、このようなもので、クライアントコードで配列を剥ぎどちらか：あなたはこれを持っている場合は

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

文字コード：

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

あなたのJavaScriptファイルでは、そのコードを生成して修正する必要があります。 Backboneビューに埋め込まれているようなリテラルデータがある場合は、Backboneを正しく使用していない可能性があります。テンプレートのデータは、おそらくBackboneモデルから取得する必要があります。

バックボーンモデルからJSONを取得している場合は、toJSONがJavaScriptオブジェクトを提供する単一のモデルではなく、コレクション（配列を返します）にtoJSONを呼び出すと思います。

Answer 2

Handlebarsをコールして、コレクションの出力をループするのは完全に合理的です。 また、配列は、ビューでのデータ処理の設計上の悪い決定ではありません。

ハンドルバーには、数字または記号識別子as described hereを扱う特殊な構文があります。だから、より多くの正解はハンドルは、このようなテンプレートで配列にアクセスすることができるということです。

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

入力：メール：[{ヘッダ：{件名：[「こんにちはダーリン」、「...他」]}} 、...続きを読む]

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