blocks|key|284028|text|在Handlebar中没有这方面的东西，但是你可以很容易地添加你自己的助手。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|284029|如果你只是想做n次的事情，那么：|offset|length|style|CODE|284030|Handlebars.registerHelper('times',+function(n,+block)+{
++++var+accum+=+'';
++++for(var+i+=+0;+i+<+n;+%2B%2Bi)
++++++++accum+%2B=+block.fn(i);
++++return+accum;
});|code-block|syntax|javascript|284031|和|284032|{{#times+10}}
++++{{this}}
{{/times}}|284033|如果你想要一个完整的for(;;)循环，那么如下所示：|284034|Handlebars.registerHelper('for',+function(from,+to,+incr,+block)+{
++++var+accum+=+'';
++++for(var+i+=+from;+i+<+to;+i+%2B=+incr)
++++++++accum+%2B=+block.fn(i);
++++return+accum;
});|284035|284036|{{#for+0+10+2}}
++++{{this}}
{{/for}}|284037|演示：http://jsfiddle.net/ambiguous/WNbrL/|284038|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/ambiguous/WNbrL/^0|0|7|1|0|0|0|0|A|7|0|0|0|0|3|10|0|0^^$0|@$1|2|3|4|5|6|7|17|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|18|8|@$D|19|E|1A|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|1B|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|1C|8|@]|9|@]|A|$]]|$1|O|3|P|5|J|7|1D|8|@]|9|@]|A|$K|L]]|$1|Q|3|R|5|6|7|1E|8|@$D|1F|E|1G|F|G]]|9|@]|A|$]]|$1|S|3|T|5|J|7|1H|8|@]|9|@]|A|$K|L]]|$1|U|3|N|5|6|7|1I|8|@]|9|@]|A|$]]|$1|V|3|W|5|J|7|1J|8|@]|9|@]|A|$K|L]]|$1|X|3|Y|5|6|7|1K|8|@]|9|@$D|1L|E|1M|1|1N]]|A|$]]|$1|Z|3|-4|5|6|7|1O|8|@]|9|@]|A|$]]]|10|$11|$5|12|13|14|A|$15|16]]]]

There's nothing in Handlebars for this but you can add your own helpers easily enough.

If you just wanted to do something <code>n</code> times then:

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

and

<pre><code>{{#times 10}}
 &lt;span&gt;{{this}}&lt;/span&gt;
{{/times}}
</code></pre>

If you wanted a whole <code>for(;;)</code> loop, then something like this:

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

and

<pre><code>{{#for 0 10 2}}
 &lt;span&gt;{{this}}&lt;/span&gt;
{{/for}}
</code></pre>

Demo: <a href="http://jsfiddle.net/ambiguous/WNbrL/" rel="noreferrer">http://jsfiddle.net/ambiguous/WNbrL/</a>

blocks|key|284069|text|如果你喜欢CoffeeScript|type|unstyled|depth|inlineStyleRanges|entityRanges|data|284070|Handlebars.registerHelper+"times",+(n,+block)+->
++(block.fn(i)+for+i+in+[0...n]).join("")|code-block|syntax|javascript|284071|和|284072|{{#times+10}}
++{{this}}
{{/times}}|284073|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

If you like CoffeeScript

<pre><code>Handlebars.registerHelper "times", (n, block) -&gt;
 (block.fn(i) for i in [0...n]).join("")
</code></pre>

and

<pre><code>{{#times 10}}
 &lt;span&gt;{{this}}&lt;/span&gt;
{{/times}}
</code></pre>

blocks|key|284133|text|这段代码将处理else块，以防n作为动态值出现，并提供@index可选上下文变量，它还将保留执行的外部上下文。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|284134|/*
*+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+%2B=+1+)+{
++++++++++++data.index+=+i;
++++++++++++out+%2B=+opts.fn(this,+{
++++++++++++++++data:+data
++++++++++++});
++++++++}
++++}+else+{

++++++++out+=+opts.inverse(this);
++++}

++++return+out;
});|code-block|syntax|javascript|284135|entityMap^0|F|1|R|6|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|S|8|@]|D|@]|E|$]]]|L|$]]

This snippet will take care of else block in case <code>n</code> comes as dynamic value, and provide <code>@index</code> optional context variable, it will keep the outer context of the execution as well.

<pre><code>/*
* 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 &lt; times; i += 1 ) {
 data.index = i;
 out += opts.fn(this, {
 data: data
 });
 }
 } else {

 out = opts.inverse(this);
 }

 return out;
});
</code></pre>

blocks|key|500864|text|如果您想使用last+/+first+/+index，这里的Top回答是很好的，不过您可以使用以下内容|type|unstyled|depth|inlineStyleRanges|entityRanges|data|500865|Handlebars.registerHelper('times',+function(n,+block)+{
++++var+accum+=+'';
++++for(var+i+=+0;+i+<+n;+%2B%2Bi)+{
++++++++block.data.index+=+i;
++++++++block.data.first+=+i+===+0;
++++++++block.data.last+=+i+===+(n+-+1);
++++++++accum+%2B=+block.fn(this);
++++}
++++return+accum;
});|code-block|syntax|javascript|500866|和|500867|{{#times+10}}
+++++{{@first}}+{{@index}}+{{@last}}
{{/times}}|500868|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Top answer here is good, if you want to use last / first / index though you could use the following 

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

and

<pre><code>{{#times 10}}
 &lt;span&gt; {{@first}} {{@index}} {{@last}}&lt;/span&gt;
{{/times}}
</code></pre>

blocks|key|500916|text|几年后，但现在在Handlebar中提供了each，它允许您非常容易地迭代一组项。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|500917|https://handlebarsjs.com/guide/builtin-helpers.html#each|500918|entityMap|0|LINK|mutability|MUTABLE|url^0|L|4|0|0|1K|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|R|8|@]|D|@$9|S|A|T|1|U]]|E|$]]|$1|H|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|I|$J|$5|K|L|M|E|$N|G]]]]

Couple of years late, but there's now <code>each</code> available in Handlebars which allows you to iterate pretty easily over an array of items.
<a href="https://handlebarsjs.com/guide/builtin-helpers.html#each" rel="nofollow noreferrer">https://handlebarsjs.com/guide/builtin-helpers.html#each</a>

I’m new to Handlebars.js and just started using it. Most of the examples are based on iterating over an object. I wanted to know how to use handlebars in basic for loop.

Example.

<pre><code>for(i=0 ; i&lt;100 ; i++) {
 create li's with i as the value
}
</code></pre>

How can this be achieved?

Iterating over basic “for” loop using Handlebars.js

我是Handlebars.js的新手，刚刚开始使用它。大多数示例都是基于对对象的迭代。我想知道如何在基本的for循环中使用handlebars。举例说明。for(i=0 ; i<100 ; i++) { create li's with i as the value}如何才能做到这一点？

问使用Handlebars.js遍历基本的“for”循环
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用Handlebars.js遍历基本的“for”循环EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用Handlebars.js遍历基本的“for”循环
EN