javascript - Accediendo al índice en#cada uno en emberjs

ember.js handlebars.js

Question

Hola a todos, revisen el código adjunto

http://jsbin.com/atuBaXE/2/

Estoy intentando acceder al índice usando {{@index}} pero no parece estar compilando. Creo que el manillar soporta eso

{{#each item in model}}
  {{@index}} 
  {{item}}
{{/each}}

No funciona, no puedo entender si el {{@index}} es compatible o no

estoy usando

Ember.VERSION: 1.0.0 Handlebars.VERSION: 1.0.0

Gracias

Answer 1

Me gusta la respuesta de @ kingpin2k: The Ember Way es usar un controlador para decorar un modelo, y en este contexto queremos decorarlo agregando una propiedad de índice para representar su lugar en la colección.

Lo hago de forma ligeramente diferente, construyendo una colección separada de controladores de instancia decorados para la tarea en cuestión:

App.PostsIndexController = Ember.ArrayController.extend({
  indexedContent: function() {
    get(''content'').map(function(item, index) {
      App.PostsItemController.create({
        content: item,
        index: index
      });
    });
  }.property(''content'')
});

App.PostsItemController = Ember.ObjectController.extend({
  index: null
});

Answer 2

No, no existe en la versión de Ember de Handlebars, una forma es usar un controlador de elemento y agregarle una propiedad que diga si es el primero o el último, etc.

App.IndexController = Ember.ArrayController.extend({
  itemController: ''itemer''
});

App.ItemerController = Ember.ObjectController.extend({
  needs:[''index''],
  isFirst: function(){
    return this.get(''color'') === this.get(''controllers.index.firstObject.color'');
  }.property(''controllers.index.firstObject'')
});

http://emberjs.jsbin.com/aPewofu/1/edit

Answer 3

Nota, con respecto a la sintaxis @index específicamente, a partir de octubre de 2014:

Ember no admite @index (ni ninguna de las otras propiedades de tipo @data).

https://github.com/toranb/ember-template-compiler/issues/16#issuecomment-38823756

Answer 4

Si solo busca mostrar el índice como un valor indexado de 1 en su vista, también podría darle una oportunidad a los contadores de CSS . Se supported todo el camino de regreso a IE 8.

Answer 5

ACTUALIZAR

Desde este PR , ahora es posible utilizar cada ayudante con índice, tomando como referencia la nueva sintaxis de bloque de parámetros. Esto está disponible en canary y con suerte estará habilitado por defecto en Ember 1.11

{{#each model as |item index|}}
  <li>
    Index: {{index}} Content: {{item}}
  </li>
{{/each}}

Muestra en vivo

PARA VIEJAS VERSIONES

Puedes usar {{_view.contentIndex}} .

{{#each item in model}}
  <li>
    Index: {{_view.contentIndex}} Content: {{item}}
  </li>
{{/each}}

Muestra en vivo