Accueil > Python > Cohabitation Jinja et AngularJS

Cohabitation Jinja et AngularJS

Jinja2, un moteur de templates en Python, et AngularJS, un framework web côté client en Javascript, utilisent tous les deux les accolades pour indiquer une variable ou une structure à interpréter.
Par exemple {{ choucroute }} pour une variable qui a du goût.

D’où conflit.
Pour résoudre ce problème, trois possibilités :

Diviser les fichiers pour régner

Séparer l’utilisation de chaque template :

  • variables Jinja uniquement dans les fichiers html fournis directement par l’application Python ;
  • variables AngularJS uniquement dans les fichiers chargés dynamiquement (par exemple /partials/detail-choucroute.html).

Simple à mettre en place mais limité.

Commenter les accolades

Protéger le code AngularJS sensible en empêchant son interprétation par Jinja :

  • {{ '{{' }} pour ne pas interpréter des accolades ;
  • {% raw %} pour un code plus long.

Changer les délimiteurs Jinja

Redéfinir les délimiteurs dans l’environnement de Jinja :

jinja_env = jinja2.Environment(...)
jinja_env.block_start_string = '(%'
jinja_env.block_end_string = '%)'
jinja_env.variable_start_string = '(('
jinja_env.variable_end_string = '))'
jinja_env.comment_start_string = '(#'
jinja_env.comment_end_string = '#)'

L’ensemble des caractères accolades ont été remplacés par des parenthèses pour une raison de cohérence. Limiter la redéfinition des délimiteurs à variable_start_string et variable_end_string devrait suffire.

Bien évidemment, libre à chacun de choisir d’autres délimiteurs.

À noter qu’il est possible d’obtenir un résultat similaire avec Django.

Catégories :Python Étiquettes : ,
  1. Aucun commentaire pour l’instant.
  1. No trackbacks yet.

Votre commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l’aide de votre compte WordPress.com. Déconnexion /  Changer )

Photo Google

Vous commentez à l’aide de votre compte Google. Déconnexion /  Changer )

Image Twitter

Vous commentez à l’aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l’aide de votre compte Facebook. Déconnexion /  Changer )

Connexion à %s

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur la façon dont les données de vos commentaires sont traitées.

%d blogueurs aiment cette page :