1

私の質問は、テンプレート内のパラメーター「スタイル」と「コンテンツ」にどのようにアクセスできますか?、別のヘルパーを作成してヘルパーを変更しました (基本は公式 Web と同じです)、それらにアクセスできません。

テンプレート

<div id=emoticons class="change_profile">
    {{#each all_avatars.images_male}}//this is an array['m1', 'm2, ...]'
        <img src="domain.com/{{this.content}}.png" style="{{this.style}}">
    {{/each}}
</div>                  

ヘルパー

<script>
     Handlebars.registerHelper('each', function(icons_list) {
         var icons=[];
         var single={
             content:'',
             style:''
         }      
         for(var i=0, j=icons_list.length; i<j; i++) {
                    single.content = icons_list[i];
                    single.style='<something>';             
                    icons[i]=single; 
          }     
          return icons;
        });
</script>       

結果

<div id=emoticons class="change_profile">

[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]                             

</div>
4

1 に答える 1

2

Handlebars.js のドキュメント ( Simple Iteratorsを参照) に基づいて、ヘルパーはドキュメントに直接レンダリングされる文字列を返すことになっています。配列 ( ) を返すため、icons文字列に変換され、そのままレンダリングされます。

ヘルパーの次の宣言は、特にoptions.fn(single)、Handlebars.js を呼び出してimgタグ付け用のテンプレートを適切な画像に変換できるようにする必要があることを考えると、より良い結果をもたらすはずです。

<script>
    Handlebars.registerHelper('each', function(icons_list, options) {
        var icons="";
        var single={ content:'', style:'' };

        for(var i=0, j=icons_list.length; i<j; i++) {
            single.content = icons_list[i];
            single.style='<something>';             
            icons += options.fn(single); 
        }       
        return icons;
    });
</script>   

そうは言っても、この種のロジックを という名前のヘルパーに入れるのは、eachすぐに混乱を招く可能性があるため、お勧めできません。ドキュメントで宣言されているものと同じものを使用しeach、テンプレートを置き換えます。

<div id=emoticons class="change_profile">
    {{#each all_avatars.images_male}}
        <img src="domain.com/{{this}}.png" style="<something>">
    {{/each}}
</div>
于 2013-02-12T13:39:52.273 に答える