Flask からテンプレート内の JavaScript にデータを渡すにはどうすればよいですか?

Patricia Arquette
リリース: 2024-10-28 13:01:30
オリジナル
790 人が閲覧しました

How Can I Pass Data from Flask to JavaScript in Templates?

Flask からテンプレート内の JavaScript にデータを渡す

Flask では、Python コードからテンプレート内の JavaScript コードにデータを渡すことができます。これは、マップやチャートなどのインタラクティブな要素を設定する場合に便利です。

標準的なアプローチ

基本的な方法には、テンプレート内で {{ variable }} を使用することが含まれます。これには、Python コードの任意の値を含めることができます。例:

# Python code
geocode = (latitude, longitude)
return render_template('get_data.html', geocode=geocode)
ログイン後にコピー
# HTML template
<head>
  <script>
    var someJavaScriptVar = '{{ geocode[1] }}';
  </script>
</head>
ログイン後にコピー

tojson フィルターの使用

Jinja2 は tojson フィルターも提供します。これを使用して、Python オブジェクトを JSON 文字列に変換し、JavaScript に直接渡すことができます。

# Python code
geocode = (latitude, longitude)
return render_template('get_data.html', geocode=geocode|tojson)
ログイン後にコピー
# HTML template
<head>
  <script>
    var myGeocodeObj = {{ geocode|tojson }};
  </script>
</head>
ログイン後にコピー

高度な使用法

Jinja2 は、JavaScript を構築するための他のさまざまな機能をサポートしています。ループや条件文を含むコード。詳細については、Jinja2 のドキュメントを参照してください。

以上がFlask からテンプレート内の JavaScript にデータを渡すにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!