itérer tableau JSON avec la moustache

Je suis nouveau à Moustache, s'il vous plaît garder avec moi 🙂

J'ai un tableau dans mon JSON

"prop":{"brands":["nike","adidas","puma"]}

si j'ai le modèle comme celui-ci

{{#prop}}
 <b>{{brands}}</b>
{{prop}}

et je veux obtenir quelque chose comme:

<b>nike</b>
<b>adidas</b>
<b>puma</b>

Je comprends les éléments dans le tableau ne sont pas hachage de paires clé-valeur, cependant je me demande si il est de toute façon dans la moustache que je peux faire une itération sur les éléments.

Merci!

OriginalL'auteur Liang | 2013-06-24

  1. 2

    moustache est logicless, afin d'écrire votre propre itération/boucle est impossible. Il est facile de convertir votre JSON. Par exemple:

    var json = '{"prop":{"brands":["nike","adidas","puma"]}}';
var obj = JSON.parse(json);
var data = {brands: obj.prop['brands'].map(function(x){ return {name: x}; })};

    Vous donne un data variable qui va travailler avec le modèle:

    {{#brands}}
  <b>{{name}}</b>
{{/brands}}
    Merci, parser le JSON avant de la main semble être la meilleure solution.

    OriginalL'auteur Paulpro

  2. 33

    Ici est un travail de violon: http://jsfiddle.net/Qa4UX/

    Fondamentalement, vous avez besoin pour effectuer une itération sur les marques de tableau.
    Depuis votre tableau est cru et n'a pas les objets à l'intérieur vous avez de référence de chaque chaîne:

    {{#props}}
  <ul>
  {{#brands}}
    <li>
    {{#.}}
        <b>{{.}}</b>
    {{/.}}
    </li>
  {{/brands}}
  </ul>
{{/props}}

    Vous pouvez également trouver de nombreux autres exemples ici: https://github.com/janl/mustache.js#mustachejs---logic-less-mustache-templates-with-javascript

    merci pour la réponse, Paul, je vois votre point de vue et pense que ce serait une solution, mais je n'arrive pas à obtenir le violon exemple pour produire le html résultat whenI appuyez sur "exécuter", mais une très belle solution, merci!
    salut. Juste par curiosité: Ne voyez-vous pas la liste dans le cadre html dans jsfiddle?
    Nope, <div id="testmustache"></div> est tout ce que je vois, et le "Run" lien ne fait rien pour elle...
    J'ai mis à jour le violon. Le problème était que la moustache n'a pas été chargé dans Chrome, mais il a travaillé dans Safari. J'ai changé la moustache à la source et maintenant, il doit travailler
    Merci pour cette et la JS Fiddle. Est le {{#.}} et {{/.}} partie obligatoire/les meilleures pratiques ? Je n'arrivais pas à trouver de la documentation sur ce

    OriginalL'auteur peshkira

  3. 17

    Cela fonctionne

    {{#json.props.brands}}
<h1>{{.}}</h1>
{{/json.props.brands}}

    {{.}} Lorsqu'une boucle sur un tableau de chaînes, un . peut être utilisé pour faire référence à l'élément courant de la liste.

    OriginalL'auteur Ariel