1

我的问题是如何访问模板中的参数“样式”和“内容”?,我通过创建另一个助手修改了助手(基础与官方网站中的相同),但我无法访问它们。

模板

<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 回答