web-dev-qa-db-fra.com

Accès à l'index dans #each dans emberjs

Veuillez vérifier le code ci-joint

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

J'essaie d'accéder à l'index à l'aide de {{@index}} mais ne semble pas être en cours de compilation. Je pense que le guidon soutient cela

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

Cela ne fonctionne pas pour, je ne peux pas savoir si le {{@index}} est pris en charge ou non

J'utilise

  • Ember.VERSION: 1.0.0
  • Guidon.VERSION: 1.0.0
javascriptember.jshandlebars.js
43
Mohammad Abu Musa

[~ # ~] mise à jour [~ # ~]

Depuis ce PR , il est maintenant possible d'utiliser chaque assistant avec index, en prenant en compte la nouvelle syntaxe des paramètres de bloc. Ceci est disponible sur Canary et, espérons-le, sera activé par défaut dans ember 1.11

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

échantillon en direct

POUR LES ANCIENNES VERSIONS

Vous pouvez utiliser {{_view.contentIndex}}.

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

échantillon en direct

128
Marcio Junior

Non, il n'existe pas dans la version Ember des guidons, une façon consiste à utiliser un contrôleur d'élément et à lui ajouter une propriété indiquant s'il s'agit du premier ou du dernier, 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

4
Kingpin2k

Remarque, concernant spécifiquement la syntaxe @index, à partir d'octobre 2014:

Ember ne prend pas en charge @index (ni aucune des autres propriétés de type @data).

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

3
Feckmore

J'aime la réponse de @ kingpin2k - La manière Ember consiste à utiliser un contrôleur pour décorer un modèle, et dans ce contexte, nous voulons le décorer en ajoutant une propriété d'index pour représenter sa place dans la collection.

Je le fais légèrement différemment, en créant une collection distincte de contrôleurs d'instance décorés pour la tâche à accomplir:

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

Si vous cherchez simplement à afficher l'index sous la forme d'une valeur indexée 1 dans votre vue, vous pouvez également donner CSS Counters un tir. Ils sont pris en charge tout le chemin du retour à IE 8.

1
typeoneerror