Как вставить значение в {% url tag%} из сценария js внутри шаблона django

Question

Я использую листовку JS в шаблоне Django. Я хочу показать маркеры на карте, где широта и долгота берутся из набора запросов. Я понял, что могу отправить набор запросов по представлениям, а затем, используя язык шаблонов Django, использовать его внутри, чтобы установить lat i lon для определенного маркера. Я хотел бы иметь изображение во всплывающем окне маркера, и вот тут моя проблема. Я знаю, что я не могу использовать JS, потому что его клиентская сторона по сравнению с шаблоном Django является серверной, но как решить случай, когда вы хотите динамически создавать маркеры и всплывающее окно с изображением, которое находится в базе данных. Должен ли я использовать AJAX для этого?

мои представления:

class MapView(ListView):
    template_name = 'map.html'
    model = Post
    queryset = serialize('json', Post.objects.all(), fields = ['lat','lon', 'image'])

и шаблон, где ниже для l oop это marker1, где всплывающее окно жестко закодировано и работает нормально:

var map = L.map('map').setView([49.175573,20.072700], 11);
    
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

var post_base = {{object_list|safe}}
    
    for (let index = 0; index < post_base.length; index++) {
        console.log(post_base[index]['fields']['lat']);

        var image_path = post_base[index]['fields']['images']
        marker = new L.marker([post_base[index]["fields"]["lat"],post_base[index]["fields"]["lon"]]).addTo(map)
        .bindPopup("<img style=10%; src={% static 'images/????????????????????????'%}/>");
    }

marker1 = new L.marker([49.295236, 20.413089],{opacity:0.5}).addTo(map)
    .bindPopup("<img src={% static 'images/lomnica_image.jpeg' %}/>");

</script>

Кто-нибудь может объяснить, как правильно ее решить? Спасибо

Answer 1

Привет, вы абсолютно правы, вы не можете выполнить свой код js на стороне сервера без сборщика или чего-то вроде webpack, parcel и т. Д. c.

Итак, если вы решите визуализировать время выполнения маркера с помощью клиента стороне, вероятно, вам нужно попробовать django структуру REST , которая предоставляет множество инструментов для создания REST API, таких как сериализаторы и наборы представлений.

Но, конечно, вы все равно можете использовать собственный Django для создания Сериализация данных упрощается с помощью Django сериализаторов

Также вы можете использовать этот репозиторий в качестве примера для запуска.