loops - handlebars - cada uno con índice y módulo en brasas y manillar

helpers ember

Question

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:

https://github.com/johanpoirier/resthub-backbone-stack/commit/8a318477d56c370d2a0af4da6eae9999c7bb29da

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}}

Answer 1

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

Answer 2

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>