3

ソーシャル ボタン (href、alt、img) の情報を含む配列があります。配列を循環してオブジェクトを追加するパーシャルを作成しました。これが私が持っているものです。

配列:

var social=[
    {

        "url":"http://twitter.com/share?text="+encodeURIComponent(this.title)+" "+encodeURIComponent('#grnsrve')+"&url="+domain+"&via="+twitterAcct,
        "image":"IMG/media/twitter_16.png",
        "alt":"twitter link"
    },
    {
        "url":"http://twitter.com/share?text="+encodeURIComponent(this.title)+" "+encodeURIComponent('#grnsrve')+"&url="+domain+"&via="+twitterAcct,
        "image":"IMG/media/twitter_16.png",
        "alt":"twitter link"
    },
    {
        "url":"http://twitter.com/share?text="+encodeURIComponent(this.title)+" "+encodeURIComponent('#grnsrve')+"&url="+domain+"&via="+twitterAcct,
        "image":"IMG/media/twitter_16.png",
        "alt":"twitter link"
    }
];

テンプレート:

social_partial = '<a href="{{url}}" alt="{{alt}}"><img src="{{image}}"/></a>';

部分関数:

Handlebars.registerPartial('addSocial',social_partial);

そしてメインのテンプレート:

<div class="tip_social">
    {{>addSocial social}}
</div>

「Depth0 is undefined error」というメッセージが表示されます。別のコンテキストを取得する parials に関するドキュメントを探してみましたが、まだ見つかりません。

ここで編集は、それのより完全なフィドルです

4

3 に答える 3

8

私にとっても同じ問題です。少し掘り下げて、1 つの顔の手のひらを後で見つけたのは次のとおりです。

tl;dr答え

パーシャルに渡すコンテキストには十分注意してください。何らかの方法で null または空のオブジェクトをパーシャルに渡すと、depth0 is undefinedエラーが発生します

少し長い答え

JSFiddle の例:

作業バージョンで変更された唯一のことは、パーシャルに有効なコンテキストを渡していることです。

ところで、非常に役立つトリックは、このブログのデバッグ ヘルパーを使用することです。

アンサーボットの独裁者「コード例」

<script id="parent">
 <table>
   <thead>
      <tr>
        <th>One</th>
        <th>Two</th>
      </tr>
    </thead>
    <tbody>
    {{#each collection}}
       {{>myPartial nothingHere}} <!-- Broken context -->
    {{/each}}
    </tbody>
 </table>
</script>

上記の壊れたコンテキストにより、ハンドルバーが停止します。あなたの問題については、タグを付けて掘り下げてみて、{{debug}}それが役立つかどうかを確認してください。

より良いコード例については、jsFiddles をご覧ください。ここにあるすべてのコードを再投稿し、書式を整えて見栄えを良くし、StackOverflow アンサーボット独裁者を満足させることは、仕事でこれを行うには少し大変でした ^_~

于 2012-10-22T22:49:45.343 に答える
2

問題を再現するのに十分なコードを提供していないため、何が間違っているのかわかりません。ただし、それを機能させるのは難しくありません。まず第一に、メインのテンプレートは反復処理を行い、次のsocialように各要素をパーシャルにフィードする必要があります。

<script id="t" type="text/x-handlebars-template">
    {{#each social}}
        <div class="tip_social">
            {{>addSocial this}}
        </div>
    {{/each}}
</script>

そして、次のようなもので HTML を取得できます。

​var t    = Handlebars.compile($('#t').html());
var html = t({social: social}));​​

デモ: http://jsfiddle.net/ambiguous/SsdbU/1/

于 2012-08-07T06:38:08.233 に答える