如何在 Meteor Spacebars 模板中重复 N 次块?
How can I repeat a block N times in a Meteor Spacebars template?
我在空格键模板中有这段代码:
1.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
我想重复 N 次,每次递增数字:
1.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
2.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
3.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
我希望能够将 N 传递给自定义模板标签来处理这个问题(例如 {{choices 3}}
)。什么是好的 DRY 方法来做到这一点?我有一个模糊的想法我可以写一个模板助手,但我不确定从哪里开始。
工作示例:
http://meteorpad.com/pad/THAQfpfrru5MgAGnS/Copy%20of%20Leaderboard
您可以传入计数和 return 任意对象数组。不是最优雅的......但它有效!
HTML
<body>
{{>content}}
</body>
<template name="content">
{{#each loopCount 5}}
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
{{/each}}
</template>
JS
Template.content.helpers({
choices: function(){
return ['choice1','choice2','choice3']
},
loopCount: function(count){
var countArr = [];
for (var i=0; i<count; i++){
countArr.push({});
}
return countArr;
}
});
如果您正在使用 Meteor 的 underscore 包,并且恰好也在使用 CoffeScript,您可以创建以下单行模板助手:
t.helpers
loop: (count) -> {} for i in _.range count
然后您可以在您的模板中使用这个助手:
{{! Will display 'Output' 5 times }}
{{#each loop 5}}
Output
{{/each}}
我在空格键模板中有这段代码:
1.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
我想重复 N 次,每次递增数字:
1.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
2.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
3.
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
我希望能够将 N 传递给自定义模板标签来处理这个问题(例如 {{choices 3}}
)。什么是好的 DRY 方法来做到这一点?我有一个模糊的想法我可以写一个模板助手,但我不确定从哪里开始。
工作示例: http://meteorpad.com/pad/THAQfpfrru5MgAGnS/Copy%20of%20Leaderboard
您可以传入计数和 return 任意对象数组。不是最优雅的......但它有效!
HTML
<body>
{{>content}}
</body>
<template name="content">
{{#each loopCount 5}}
<select class="form-group">
{{#each choices}}
<option>{{this}}</option>
{{/each}}
</select>
{{/each}}
</template>
JS
Template.content.helpers({
choices: function(){
return ['choice1','choice2','choice3']
},
loopCount: function(count){
var countArr = [];
for (var i=0; i<count; i++){
countArr.push({});
}
return countArr;
}
});
如果您正在使用 Meteor 的 underscore 包,并且恰好也在使用 CoffeScript,您可以创建以下单行模板助手:
t.helpers
loop: (count) -> {} for i in _.range count
然后您可以在您的模板中使用这个助手:
{{! Will display 'Output' 5 times }}
{{#each loop 5}}
Output
{{/each}}