Maison  >  Article  >  développement back-end  >  Comment puis-je transmettre des données spécifiques d'un dictionnaire Flask à JavaScript dans un modèle HTML ?

Comment puis-je transmettre des données spécifiques d'un dictionnaire Flask à JavaScript dans un modèle HTML ?

Linda Hamilton
Linda Hamiltonoriginal
2024-10-31 09:21:02723parcourir

How can I pass specific data from a Flask dictionary to JavaScript within an HTML template?

Transmission de données de Flask vers JavaScript dans des modèles

Votre application utilise une API pour récupérer les données stockées dans un dictionnaire. Votre objectif est de transmettre des informations spécifiques, à savoir les coordonnées de longitude et de latitude, de ce dictionnaire à JavaScript dans la vue. Pour comprendre comment cela peut être réalisé, il est essentiel de comprendre le processus de transmission de variables aux modèles par Flask.

Flask utilise la fonction render_template pour envoyer des variables à un modèle qui est rendu dans un navigateur. Grâce au moteur de modèles Jinja2, ces variables sont accessibles et affichées dans le balisage HTML.

Pour rendre la variable disponible en JavaScript, vous pouvez utiliser la capacité de Jinja2 à intégrer des expressions Python directement dans vos modèles. Placez simplement le nom de la variable entre doubles accolades ({{ variable_name }}). Par exemple, vous pouvez transmettre le géocode à JavaScript à l'aide de l'extrait de code suivant :

<code class="html"><script>
  var myGeocode = '{{ geocode[1] }}';
</script></code>

Cet extrait de code attribue la valeur de géocode[1] à la variable JavaScript myGeocode. Notez que vous pouvez accéder à n'importe quelle variable transmise au modèle en utilisant cette syntaxe, quelle que soit sa position dans le document HTML.

Pour des structures de données plus complexes comme des listes, vous pouvez utiliser la fonction join() pour construire une virgule. -chaîne séparée et transmettez-la sous forme de tableau à JavaScript. Voici un exemple :

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

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn