Heim >Web-Frontend >js-Tutorial >Wie kann ich in einer Vorlage Daten von Flask an JavaScript übergeben?

Wie kann ich in einer Vorlage Daten von Flask an JavaScript übergeben?

Barbara Streisand
Barbara StreisandOriginal
2024-10-29 03:40:29904Durchsuche

How Can I Pass Data from Flask to JavaScript in a Template?

Übergabe von Daten von Flask an JavaScript in einer Vorlage

In Flask-Anwendungen besteht eine häufige Anforderung darin, Daten von Python an JavaScript innerhalb eines zu übergeben Vorlage. Diese Daten können aus Datenbankabfragen, API-Antworten oder einer anderen Quelle stammen.

Eine Möglichkeit, dies zu erreichen, ist Jinja2, die von Flask verwendete Template-Engine. Jinja2 bietet eine Möglichkeit, Python-Ausdrücke in HTML-Vorlagen einzubetten. Durch das Einschließen von Ausdrücken in doppelte geschweifte Klammern ({{ ) und ( }}) ist es möglich, auf Variablen zuzugreifen, Operationen durchzuführen und sogar Kontrollstrukturen auszuführen.

Um eine Python-Variable an JavaScript zu übergeben, können Sie sie einfach einschließen Fügen Sie es innerhalb eines Skript-Tags in Ihrer Vorlage hinzu. Angenommen, Sie haben eine Liste von Tupeln, die geografische Koordinaten darstellen, die in der Geocode-Variablen gespeichert sind. Sie können sie wie folgt an JavaScript übergeben:

<code class="html"><script>
  var myGeocode = [{{ ', '.join(geocode) }}];
</script></code>

Jinja2 bietet zusätzliche Funktionen, die die Integration zwischen Python und JavaScript verbessern. Ein nützlicher Filter ist tojson(), der ein Python-Objekt in das JSON-Format konvertiert. Dieser Filter kann besonders praktisch sein, um komplexe Datenstrukturen an JavaScript zu übergeben.

Hier ist ein Beispiel mit tojson():

<script>
  var myGeocode = {{ geocode | tojson }};
</script>

Sobald die Daten an JavaScript übergeben wurden, können Sie darauf zugreifen und sie bearbeiten es mithilfe der nativen Datentypen und Methoden von JavaScript.

Das obige ist der detaillierte Inhalt vonWie kann ich in einer Vorlage Daten von Flask an JavaScript übergeben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn