將python變量傳遞給javascript的Django模板Javascript

Question

我確實創建了一個名為generate_random_number的python函數，該函數generate_random_number 1到9之間的隨機數，並將其與數據庫中每個視頻的id進行比較，然后返回與匹配該隨機數的ID相對應的視頻的url 。 這是函數：

from random import randint
from dash_interface.models import Video
from django import template

register = template.Library()


@register.simple_tag
def random_video():
    random_number = randint(1, 9)
    all_videos = Video.objects.all()
    for video in all_videos:
        if video.id == random_number:
           random_url = video.video_url
           return random_url

我想將random_url傳遞給django模板中的javascript變量。

我的模板如下所示：

 <video id="videoplayer" controls></video> <script> {% load generate_random_number %} // setup the video element and attach it to the Dash player function setupVideo() { var url = " "; var context = new Dash.di.DashContext(); var player = new MediaPlayer(context); player.startup(); player.attachView(document.querySelector("#videoplayer")); player.attachSource(url); } </script> <style> video { width: 60%; height: 40%; } </style> 

有關的變量是url 。

我做了{% load generate_random_number %} ，但是我不知道是否可以用{{ random_url }}替換url的引號。

Answer 1

如果要拆分javascript代碼和html代碼，可以執行以下操作：

<script arg = {{ somevar }} src = "/path/to/script"></script>

並在腳本中：

var arg = $("script[src='/path/to/script']").attr("arg");

如果需要在每個具體時間段內更新arg，則需要制作一個ajax。 如果使用數據庫來持久化arg，則可以使用Django Channels作為更優雅的解決方案。

Answer 2

您應該將自定義模板標簽定義保存在應用程序內的templatetags文件夾中。 確保__init__.py存在於templatetags文件夾中。 您的文件夾結構應類似於：

your_django_app/
    __init__.py
    models.py
    templatetags/
        __init__.py
        template_tags.py
    views.py

並且template_tags.py的內容應該是您所需的標記定義：

from random import randint
from dash_interface.models import Video
from django import template

register = template.Library()  

@register.simple_tag
def random_video():
    random_number = randint(1, 9)
    all_videos = Video.objects.all()
    for video in all_videos:
        if video.id == random_number:
           random_url = video.video_url
           return random_url

注意： templatetags文件應包含名為register的變量。

之后，您可以在HTML中加載模板標簽。 您的代碼如下所示：

<video id="videoplayer" controls></video>
{% load template_tags %}

            <script>
            // setup the video element and attach it to the Dash player
            function setupVideo() {
              var url = "{% random_video %}";
              var context = new Dash.di.DashContext();
              var player = new MediaPlayer(context);
                              player.startup();
                              player.attachView(document.querySelector("#videoplayer"));
                              player.attachSource(url);
            }
            </script>

            <style>
            video {
              width: 60%;
              height: 40%;
            }
            </style>

Answer 3

這是我更喜歡連接Django模板和JS的方式。

您需要導入渲染功能：

views.py文件

from django.shortcuts import render
from random import randint
from dash_interface.models import Video

def random_video(request):
    random_number = randint(1, 9)
    all_videos = Video.objects.all()
    for video in all_videos:
        if video.id == random_number:
           random_url = video.video_url
           context = {
               "random_url": random_url
           }
           return render(request, "app/video.html", context)
        else:
           return render(request, "app/video.html", {})    

video.html

<video id="videoplayer" controls></video>

            <script>
                {% load generate_random_number %}
            // setup the video element and attach it to the Dash player
            function setupVideo() {
              // using the context passed in here.
              var url = {{ random_url|safe }}; 
              var context = new Dash.di.DashContext();
              var player = new MediaPlayer(context);
              player.startup();
              player.attachView(document.querySelector("#videoplayer"));
              player.attachSource(url);
            }
        </script>

        <style>
        video {
          width: 60%;
          height: 40%;
        }
        </style>

我所做的是在Django視圖中呈現HTML頁面，並將您的變量傳遞到上下文字典中，該字典以后可以在HTML標記或腳本標記中訪問。

我還在模板標記中使用了| safe參數，該參數除去了一些不需要的字符串。

歡呼，希望對您有所幫助！ 我在許多項目中都嘗試過此方法，對我而言一直是成功的。