Python Language Jinja Templating


Exemple

Semblable à Meteor.js, Flask s'intègre bien avec les services de gabarit frontaux. Flask utilise par défaut Jinja Templating. Les modèles permettent d'utiliser de petits extraits de code dans le fichier HTML, tels que les conditionnels ou les boucles.

Lorsque nous rendons un modèle, tous les paramètres au-delà du nom du fichier de modèle sont transmis au service de modélisation HTML. L'itinéraire suivant transmettra le nom d'utilisateur et la date jointe (d'une fonction ailleurs) dans le code HTML.

@app.route("/users/<username>)
def profile(username):
    joinedDate = get_joined_date(username) # This function's code is irrelevant
    awards = get_awards(username) # This function's code is irrelevant
    # The joinDate is a string and awards is an array of strings
    return render_template("profile.html", username=username, joinDate=joinDate, awards=awards)

Lorsque ce modèle est rendu, il peut utiliser les variables qui lui sont transmises depuis la fonction render_template() . Voici le contenu de profile.html :

<!DOCTYPE html>
<html>
    <head>
        # if username
            <title>Profile of {{ username }}</title>
        # else
            <title>No User Found</title>
        # endif
    <head>
    <body>
        {% if username %}
            <h1>{{ username }} joined on the date {{ date }}</h1>
            {% if len(awards) > 0 %}
                <h3>{{ username }} has the following awards:</h3>
                <ul>
                {% for award in awards %}
                    <li>{{award}}</li>
                {% endfor %}
                </ul>
            {% else %}
                <h3>{{ username }} has no awards</h3>
            {% endif %}
        {% else %}
            <h1>No user was found under that username</h1>
        {% endif %}
        {# This is a comment and doesn't affect the output #}
    </body>
</html>

Les délimiteurs suivants sont utilisés pour différentes interprétations:

  • {% ... %} indique une déclaration
  • {{ ... }} désigne une expression où un modèle est généré
  • {# ... #} indique un commentaire (non inclus dans la sortie du modèle)
  • {# ... ## implique que le reste de la ligne doit être interprété comme une déclaration