使用Handlebars.js迭代基本“for”循环

Question

我是Handlebars.js的新手，刚开始使用它。大多数例子都是基于迭代一个对象的。我想知道如何在基本for循环中使用handlebars。

例子。

for(i=0 ; i<100 ; i++) { 
    create li's with i as the value 
} 

这是如何实现的？

Answer 1

Handlebars中没有这个功能，但您可以轻松添加自己的助手。

如果你只是想做一些则n时间：

Handlebars.registerHelper('times', function(n, block) { 
    var accum = ''; 
    for(var i = 0; i < n; ++i) 
     accum += block.fn(i); 
    return accum; 
}); 

和

{{#times 10}} 
    <span>{{this}}</span> 
{{/times}} 

如果你想整个for(;;)循环，那么这样的事情：

Handlebars.registerHelper('for', function(from, to, incr, block) { 
    var accum = ''; 
    for(var i = from; i < to; i += incr) 
     accum += block.fn(i); 
    return accum; 
}); 

和

{{#for 0 10 2}} 
    <span>{{this}}</span> 
{{/for}} 

演示：http://jsfiddle.net/ambiguous/WNbrL/

Answer 2

如果你喜欢的CoffeeScript

Handlebars.registerHelper "times", (n, block) -> 
    (block.fn(i) for i in [0...n]).join("") 

和

{{#times 10}} 
    <span>{{this}}</span> 
{{/times}} 

Answer 3

这个片段会照顾别人块的情况下n当属动态值，并提供@index可选的上下文变量，它也会保留执行的外部上下文。这里

/* 
* Repeat given markup with given times 
* provides @index for the repeated iteraction 
*/ 
Handlebars.registerHelper("repeat", function (times, opts) { 
    var out = ""; 
    var i; 
    var data = {}; 

    if (times) { 
     for (i = 0; i < times; i += 1) { 
      data.index = i; 
      out += opts.fn(this, { 
       data: data 
      }); 
     } 
    } else { 

     out = opts.inverse(this); 
    } 

    return out; 
}); 

Answer 4

顶部的回答是不错的，如果你想用最后/第一/指数虽然你可以使用下面的

Handlebars.registerHelper('times', function(n, block) { 
    var accum = ''; 
    for(var i = 0; i < n; ++i) { 
     block.data.index = i; 
     block.data.first = i === 0; 
     block.data.last = i === (n - 1); 
     accum += block.fn(this); 
    } 
    return accum; 
}); 

和

{{#times 10}} 
    <span> {{@first}} {{@index}} {{@last}}</span> 
{{/times}}