En Mustache templating, y a-t-il un moyen élégant d'exprimer une liste séparée par des virgules sans la virgule finale ?

Question

Je suis en train d'utiliser la bibliothèque de modèles Mustache et j'essaie de générer une liste séparée par des virgules sans virgule finale, par exemple

rouge, vert, bleu

Créer une liste avec la virgule finale est simple, étant donné la structure

{
  "items": [
    {"name": "rouge"},
    {"name": "vert"},
    {"name": "bleu"}
  ]
}

et le modèle

{{#items}}{{name}}, {{/items}}

ceci se traduira par

rouge, vert, bleu,

Cependant, je ne vois pas de moyen élégant d'exprimer le cas sans la virgule finale. Je peux toujours générer la liste dans le code avant de la passer dans le modèle, mais je me demandais si la bibliothèque offre une approche alternative, comme vous permettre de détecter s'il s'agit du dernier élément dans une liste dans le modèle.

Answer 1

Je pense qu'une meilleure façon est de changer le modèle de manière dynamique. Par exemple, si vous utilisez JavaScript:

model['items'][ model['items'].length - 1 ].last = true;

et dans votre modèle, utilisez une section inversée:

{{#items}}
    {{name}}{{^last}}, {{/last}}
{{/items}}

pour afficher cette virgule.

Answer 2

Hrm, douteux, la démonstration de moustache vous montre clairement, avec la propriété first, que vous devez avoir la logique à l'intérieur des données JSON pour savoir quand mettre la virgule.

Donc vos données ressembleraient à :

{
  "items": [
    {"name": "rouge", "virgule": true},
    {"name": "vert", "virgule": true},
    {"name": "bleu"}
  ]
}

et votre modèle

{{#items}}
    {{name}}{{#virgule}},{{/virgule}}
{{/items}}

Je sais que ce n'est pas élégant, mais comme mentionné par d'autres, Moustache est très léger et ne propose pas de telles fonctionnalités.

Answer 3

Tromper et utiliser CSS.

Si votre modèle est :

{
  "items": [
    {"name": "red"},
    {"name": "green"},
    {"name": "blue"}
  ]
}

alors créez votre modèle

{{#items}}
    {{name}}
{{/items}}

et ajoutez un peu de CSS

#someContainer span:not(:last-of-type)::after {
  content: ", "    
}

Je suppose que quelqu'un dira que c'est un mauvais cas de mettre en forme dans la présentation mais je ne le pense pas. Séparer les valeurs par des virgules est une décision de présentation pour rendre l'interprétation des données sous-jacentes plus facile. C'est similaire à alterner la couleur de police sur les entrées.

Answer 4

Si vous utilisez jmustache, vous pouvez utiliser les variables spéciales -first ou -last:

{{#items}}{{name}}{{^-last}}, {{/-last}}{{/items}}

Answer 5

Un peu en retard à la fête mais peut-être utile pour quelqu'un qui regarde maintenant: 5.1.1 peut le faire:

{{#allVars}}{{name}}{{^-last}}, {{/-last}}{{/allVars}}

Sortie:

var1, var2, var3