Comment gérer une INSTRUCTION if dans une Moustache modèle?

Je suis en utilisant la moustache. Je suis de la génération d'une liste de notifications. Une notification objet JSON ressemble:

[{"id":1364,"read":true,"author_id":30,"author_name":"Mr A","author_photo":"image.jpg","story":"wants to connect","notified_type":"Friendship","action":"create"}]

Avec moustache, comment puis-je faire une instruction if ou cas fondée sur la notified_type & action...

Si notified_type == "Friendship" rendu ......

Si notified_type == "Other && action == "invite" rendu.....

Comment cela fonctionne?

InformationsquelleAutor AnApprentice | 2011-12-18
  1. 60

    Moustache modèles sont, de par leur conception, très simple; le page d'accueil même dit:

    Logique templates.

    Donc, l'approche générale est de faire de votre logique en JavaScript et définir un tas de drapeaux:

    if(notified_type == "Friendship")
    data.type_friendship = true;
else if(notified_type == "Other" && action == "invite")
    data.type_other_invite = true;
//...

    et puis dans votre modèle:

    {{#type_friendship}}
    friendship...
{{/type_friendship}}
{{#type_other_invite}}
    invite...
{{/type_other_invite}}

    Si vous voulez des fonctionnalités plus avancées, mais souhaitez conserver la plupart de Moustache de simplicité, vous pouvez regarder Guidon:

    Guidon fournit la puissance nécessaire pour vous permettre de construire sémantique des modèles efficacement avec aucune frustration.

    Moustache modèles sont compatibles avec un Guidon, de sorte que vous pouvez prendre une Moustache modèle, de l'importation dans le Guidon, et commencer à profiter de l'extra Guidon fonctionnalités.

    InformationsquelleAutor mu is too short
  2. 52

    Juste pris un coup d'oeil sur la moustache docs et soutenir la "inversé sections", dans lequel ils affirment

    ils (inversé sections) sera affiché si la clé n'existe pas, est faux, ou est la liste vide

    http://mustache.github.io/mustache.5.html#Inverted-Sections

    {{#value}}
  value is true
{{/value}}
{{^value}}
  value is false
{{/value}}
    • Excellent travail de montrer comment de si vrai, et de faire de faux ainsi!
    • Cette réponse était en fait mieux pour moi que de la a accepté, comme je voulais l'utiliser dans "l'automatisation de jira" plugin qui utilise la moustache.
    InformationsquelleAutor Lucas
  3. 31

    En général, vous utilisez le # syntaxe:

    {{#a_boolean}}
  I only show up if the boolean was true.
{{/a_boolean}}

    L'objectif est de déplacer autant que possible la logique de la modèle (ce qui est logique).

    InformationsquelleAutor Dave Newton
  4. 11

    J'ai une simple et générique hack pour effectuer clé/valeur si la déclaration au lieu de boolean-seulement dans la moustache (et dans une très lisible à la mode!) :

    function buildOptions (object) {
    var validTypes = ['string', 'number', 'boolean'];
    var value;
    var key;
    for (key in object) {
        value = object[key];
        if (object.hasOwnProperty(key) && validTypes.indexOf(typeof value) !== -1) {
            object[key + '=' + value] = true;
        }
    }
    return object;
}

    Avec ce hack, un objet comme ceci:

    var contact = {
  "id": 1364,
  "author_name": "Mr Nobody",
  "notified_type": "friendship",
  "action": "create"
};

    Va ressembler avant de transformation:

    var contact = {
  "id": 1364,
  "id=1364": true,
  "author_name": "Mr Nobody",
  "author_name=Mr Nobody": true,
  "notified_type": "friendship",
  "notified_type=friendship": true,
  "action": "create",
  "action=create": true
};

    Et votre moustache modèle devrait ressembler à ceci:

    {{#notified_type=friendship}}
    friendship…
{{/notified_type=friendship}}

{{#notified_type=invite}}
    invite…
{{/notified_type=invite}}
    • cela gonfle la moustache de données, mais est utilisable et lisible approche vaut la peine d'examiner
    • L'exemple d'égalité, c'est vraiment utile!
    InformationsquelleAutor François Dispaux