Доступ к индексу в #each в emberjs

Привет всем, пожалуйста, проверьте код прилагается

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

Я пытаюсь получить доступ к индексу с помощью {{@index}}, но не похоже, что он компилируется. Я думаю, что руль поддерживает это

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

Это не работает, я не могу понять, поддерживается ли {{@index}} или нет

я использую

Ember.VERSION: 1.0.0 Handlebars.VERSION: 1.0.0

Спасибо

5 ответов

Решение

ОБНОВИТЬ

Начиная с этого PR, теперь можно использовать каждого помощника с индексом, заранее опережая новый синтаксис блочных параметров. Это доступно на канарейке и, надеюсь, будет включено по умолчанию в ember 1.11

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

Живой образец

Для старых версий

Ты можешь использовать {{_view.contentIndex}},

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

Живой образец

Нет, его нет в версии Ember Handlebars, один из способов - использовать контроллер элемента и добавить к нему свойство, говорящее, первый это или последний, и т. Д.

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

Обратите внимание, что касательно синтаксиса @index по состоянию на октябрь 2014 года:

Ember не поддерживает @index (или любые другие свойства типа @data).

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

Мне нравится ответ от @kingpin2k- Ember Way - это использование контроллера для декорирования модели, и в этом контексте мы хотим декорировать его, добавив свойство index для представления его места в коллекции.

Я делаю это немного по-другому, создав отдельную коллекцию контроллеров экземпляров, украшенных для данной задачи:

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

Если вы просто хотите отобразить индекс в виде 1-индексированного значения в своем представлении, вы также можете попробовать счетчики CSS. Они поддерживаются вплоть до IE 8.

Другие вопросы по тегам