loops - handlebars - cada uno con índice y módulo en brasas y manillar
helpers ember (2)
Estoy creando una diapositiva, por lo que hay 3 imágenes por cada div así
<div>
<img />
<img />
<img />
</div>
</div>
<img />
<img />
<img />
</div>
Ninguno de los códigos de Internet funciona sin problemas:
http://jaketrent.com/post/every-nth-item-in-handlebars-loop/
http://rockycode.com/blog/handlebars-loop-index/
http://www.arlocarreon.com/blog/javascript/handlebars-js-everyother-helper/
y sí, incluidas las respuestas aquí en desbordamiento de pila.
¿Alguien puede proporcionar algún código que funcione perfectamente en este período actual (versión de Ember / Handlebar)?
Tengo una serie de modelos, así que me gustaría hacer algo como
{{#each model}}
{{if index % 3 == 0}}
{{/if}}
{{/each}}
Si especifica itemViewClass en each ayuda, creará una vista para cada elemento y establecerá la propiedad contentIndex:
{{#each model itemViewClass="Ember.View"}}
{{view.contentIndex}}
{{/each}}
probado en Ember v1.1.0
He estado descubriendo que el index o @index no funcionan desde dentro de la plantilla, pero puede acceder desde dentro de un ayudante.
He hecho un ejemplo aquí que demuestra esto:
http://jsbin.com/egoyay/1/edit
Editar: agregando código para responder, demostrando bloque {{else}}
Ayudante de manubrio (para uso que no sea de Ember):
Handlebars.registerHelper(''ifIsNthItem'', function(options) {
var index = options.data.index + 1,
nth = options.hash.nth;
if (index % nth === 0)
return options.fn(this);
else
return options.inverse(this);
});
Uso:
<ol>
{{#each model}}
<li>
{{#ifIsNthItem nth=3}}
Index is a multiple of 3
{{else}}
Index is NOT a multiple of 3
{{/ifIsNthItem}}
</li>
{{/each}}
</ol>