Created
June 27, 2011 14:33
-
-
Save burin/1048968 to your computer and use it in GitHub Desktop.
each_with_index handlebars helper, adds an {{index}} prop accessible from within the block
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Handlebars.registerHelper 'each_with_index', (array, fn) -> | |
buffer = '' | |
for i in array | |
item = i | |
item.index = _i | |
buffer += fn(item) | |
buffer |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// {{#each_with_index records}} | |
// <li class="legend_item{{index}}"><span></span>{{Name}}</li> | |
// {{/each_with_index}} | |
Handlebars.registerHelper("each_with_index", function(array, fn) { | |
var buffer = ""; | |
for (var i = 0, j = array.length; i < j; i++) { | |
var item = array[i]; | |
// stick an index property onto the item, starting with 1, may make configurable later | |
item.index = i+1; | |
// show the inside of the block | |
buffer += fn(item); | |
} | |
// return the finished buffer | |
return buffer; | |
}); |
I was getting the same error using handlebars-1.0.rc.1.js. The following is the solution I came up with. I like the zero based index better
Handlebars.registerHelper("each_with_index", function (array, data) {
// "array" is the name of the array you want to iterate over
array = data.contexts[0][array];
var buffer = "";
for (var i = 0, j = array.length; i < j; i++) {
var item = array[i];
// if item is already an object just add the index property
if (typeof (item) == 'object') {
item['index'] = i;
} else { // make an object and add the index property
item = {
value: item, // TODO: make the name of the item configurable
index: i
};
}
buffer += data.fn(item);
}
// return the finished buffer
return buffer;
});
Handlebars.registerHelper("each_with_index", function (array, data) {
array = data.contexts[0][array];
var buffer = "";
for (var i = 0, j = array.length; i < j; i++) {
var item = array[i];
// if item is already an object just add the index property
if (typeof (item) == 'object') {
item['index'] = i;
} else { // make an object and add the index property
item = {
value: item, // TODO: make the name of the item configurable
index: i
};
}
buffer += data.fn(item);
}
// return the finished buffer
return buffer;
});
For node:
Handlebars.registerHelper( "join", function( array, sep, options ) {
return array.map(function( item ) {
return options.fn( item );
}).join( sep );
});
<p>
{{#join companies "<br>"}}
{{name}}
{{/join}}
</p>
I don't think it's a good idea to alter template data adding an 'index' ppty to iterated elements. This can be a nasty side effect. Handlebars allow to define custom variables through options.data and createFrame
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The error message is quite accurate in this case. The second callback isn't a function, it's an object. Try this: