web-dev-qa-db-fra.com

Comment accéder à un élément de tableau d'accès par index dans le guidon?

J'essaie de spécifier l'index d'un élément dans un tableau dans un modèle de guidon:

{
  people: [
    {"name":"Yehuda Katz"},
    {"name":"Luke"},
    {"name":"Naomi"}
  ]
}

en utilisant ceci:

<ul id="luke_should_be_here">
{{people[1].name}}
</ul>

Si ce qui précède n'est pas possible, comment pourrais-je écrire un utilitaire pouvant accéder à un élément spefic dans le tableau?

javascripthandlebars.js
243
lukemh

Essaye ça:

<ul id="luke_should_be_here">
{{people.1.name}}
</ul>
372
dhorrigan

Le code suivant, avec un point supplémentaire avant l'index, fonctionne comme prévu. Ici, les crochets sont facultatifs lorsque l’index est suivi d’une autre propriété:

{{people.[1].name}}
{{people.1.name}}

Cependant, les crochets sont required dans:

{{#with people.[1]}}
  {{name}}
{{/with}}

Dans ce dernier cas, l’utilisation de l’index sans les crochets donnerait un:

Error: Parse error on line ...:
...     {{#with people.1}}                
-----------------------^
Expecting 'ID', got 'INTEGER'

En passant: les crochets sont (également) utilisés pour syntaxe segment-literal , pour faire référence à des identifiants réels (et non à des numéros d'index) qui autrement seraient invalides. Plus de détails dans Qu'est-ce qu'un identifiant valide?

(Testé avec un guidon en YUI.)

Mise à jour 2.xx

Vous pouvez maintenant utiliser l'assistant get pour cela:

(get people index)

bien que si vous obtenez une erreur à propos de l'index ayant besoin d'être une chaîne, faites:

(get people (concat index ""))
291
Arjan
{{#each array}}
  {{@index}}
{{/each}}
16
FMQB

Si les fonctionnalités non documentées ne sont pas votre jeu, la même chose peut être accomplie ici:

Handlebars.registerHelper('index_of', function(context,ndx) {
  return context[ndx];
});

Puis dans un template

{{#index_of this 1}}{{/index_of}}

J'ai écrit ce qui précède avant de prendre la main 

this.[0]

Je ne vois pas quelqu'un aller trop loin avec un guidon sans écrire ses propres aides.

15
Bret Weinraub

Si vous souhaitez utiliser des variables dynamiques

Cela ne fonctionnera pas:

{{#each obj[key]}}
...
{{/each}}

Tu as besoin de faire:

{{#each (lookup obj key)}}
...
{{/each}}

voir assistant de recherche de guidons et sous-expressions de guidons .

8
julesbou

Pendant que vous faites une boucle dans un tableau avec each et si vous voulez accéder à un autre tableau dans le contexte de l'élément en cours, procédez comme suit.

Voici les données d'exemple.


 [
 {
 nom: 'foo', 
 attr: ['boo', 'Zoo'] 
 }, 
 {
 nom: 'bar', 
 attr: ['far', 'zar'] 
 } 
]

Voici le guidon pour obtenir le premier élément du tableau attr.

{{#chaque joueur}}
 <p> {{this.name}} </ p> 

 {{#with this.attr}} 
 <p> {{this. [0]}} </ p> 
 {{/avec chaque}}

Cela produira

 <p> toto </ p> 
 <p> boo </ p> 

 <p> barre </ p> 
 <p> loin </ p>
7
Fatih

S'il vous plaît essayez ceci, si vous voulez aller chercher le premier/dernier.

{{#each list}}

    {{#if @first}}
        <div class="active">
    {{else}}
        <div>
    {{/if}}

{{/each}}


{{#each list}}

    {{#if @last}}
        <div class="last-element">
    {{else}}
        <div>
    {{/if}}

{{/each}}
6
user1378423

La syntaxe suivante peut également être utilisée si le tableau n'est pas nommé (seul le tableau est transmis au modèle):

  <ul id="luke_should_be_here">
  {{this.1.name}}
  </ul>
0
José

Dans mon cas, je voulais accéder à un tableau à l'intérieur d'un assistant personnalisé comme tel,

{{#ifCond arr.[@index] "foo" }}

Ce qui n'a pas fonctionné, mais la réponse suggérée par @julesbou a fonctionné. 

Code de travail:

{{#ifCond (lookup arr @index) "" }}

J'espère que cela t'aides! À votre santé.

0
Sharukh Mastan