Question

我有数组的值，长度是动态的。但我有4个图像持有者。手段如果数组的长度为2，我将有2个填充的持有人，并留下2个空的持有人。未填充的持有人将只是div

我尝试使用下面的代码，但这不符合我的需求，因为它会根据数组的长度产生div。

{{#each product.image}}
<div style="background-image:url(http://example.com/{{this}})"></div>
{{/each}}
<div></div>
<div></div>
<div></div>

Answer 1

如果你想要最多4个div，填充了那里的数据，如果没有数据可以使用自定义辅助函数，则为空：

Handlebars.registerHelper('times', function (index, options) {
        var result = '';
    for(var i = 0; i < 4; i++) {
       if(options.data.root.product.image[i]){
          result += '<div style="background-image:url(https://upload.wikimedia.org'+options.data.root.product.image[i]+')"></div>';
       } else {
          result += '<div>empty div</div>';
       }       
   }
   return result;
});

然后在你的HTML中：

{{#times this}}
{{/times}}

检查小提琴：fiddle

Handlebars循环为属性赋值

1 个答案: