web-dev-qa-db-ja.com

Jinja2テンプレートエンジンでAngularJSを使用することは可能ですか？

Flaskサイトがあり、AngularJS JavaScriptフレームワークを使用したいと考えています。残念ながら、区切り文字が重複しているようです。

両方が二重中括弧に依存している場合、Jinja2でAngularを使用するにはどうすればよいですか（{{ expr }}）？それも可能ですか？

pythonangularjsflaskjinja2delimiter
54
user559633

いくつかのオプションがあります。

1）Angularの区切り記号表記を変更します。

var app = angular.module('Application', []);

app.config(['$interpolateProvider', function($interpolateProvider) {
  $interpolateProvider.startSymbol('{a');
  $interpolateProvider.endSymbol('a}');
}]);

開始記号と終了記号に選択されたものはすべて、新しい区切り文字として機能します。この場合、{a some_variable a}を使用して、変数をAngularに表現します。

このアプローチには、一度設定するだけで明示的であるという利点があります。

2）Jinja2の区切り記号表記を変更します。

アプリケーションにバインドするFlaskオブジェクトのFlask.jinja_options.updateをオーバーライドまたはサブクラス化します（関連する変数：block_start_string、block_end_string、variable_start_string、variable_end_string 、comment_start_string、comment_end_string）：

jinja_options = app.jinja_options.copy()

jinja_options.update(dict(
    block_start_string='<%',
    block_end_string='%>',
    variable_start_string='%%',
    variable_end_string='%%',
    comment_start_string='<#',
    comment_end_string='#>'
))
app.jinja_options = jinja_options

機密データがサーバー側から展開されないというリスクが高いため、代わりに、あなたが唯一の開発者ではないプロジェクトのフロントエンド（つまり、Angular）の構文を変更することをお勧めします。

3）{% raw %}または{% verbatim %}を使用して、Jinja2で rawブロック を出力します。

<ul>
{% raw %}
  {% for item in seq %}
      <li>{{ some_var }}</li>
  {% endfor %}
{% endraw %}
</ul>

4）Jinja2を使用して、テンプレートに中括弧を記述します。

{{ '{{ some_var }}' }}

これは、HTMLで{{ some_var }}として出力されます。

アプローチ1に対する私の好みは明らかですが、上記のいずれでも機能します。

93
user559633

別のオプションもあります：flask-triangleは、jinja2でangularテンプレートを統合しながらフォームを構築するのに役立つ拡張機能です。角（またはjinja2）ブラケット区切り文字を変更する代わりに、識別子を追加して、式をangularとしてレンダリングする必要があるかどうかをjinja2に伝えることができます。変数の後に|angularを追加するだけです：

<div>{{variable|angular}}</div>

HTML出力では次のようにレンダリングされます：

<div>{{variable}}</div>

flask-triangleには他の機能（angularスタイルでフォームを構築するため）も付属していますが、 jinja2のangularテンプレートを読みやすくするための貴重なオプション。

5
steel00