如何在 Django 模板标签中使用 Json 变量？

Question

如何在 srcipts 中的 Django 模板标签中使用 json 变量？ 当我使用 django 模板标签和我自己的自定义标签时，我无法在 javascript 字符串中使用变量，例如： {% if ${comment}|comment_like_ip:ip %}

$(document).ready(function(){

    const comments = document.getElementById('comments')
    const loadBtn = document.getElementById('load-btn')
    const loadBox = document.getElementById('loadBox')
    let visible = 3

    vis = {
        num : visible,
    }

    let handleGetData = () => {
        $.ajax({
            type: 'GET',
            data: vis,
            url: "{% url 'load-comments' video.slug %}",
            success: function(response) {
                max_size = response.max
                const data = response.data
                console.log(data)
                data.map(comment=>{
                    console.log(comment.id)
                    if(comment.is_child) {
                        comments.innerHTML += `<div class="comment">
                                                ${comment.nickname} | ${comment.timestamp}
                                                <div style="background-color: black; width: 300px;">
                                                    <p>Ответ: ${comment.parent_name}</p>
                                                    <p>Комментарий: "${comment.parent_text}"</p>
                                                </div>
                                                <p>${comment.text}</p>
                                                <p><a href="#" class="like-comment" data-id="${comment.id}">
                                                    {% if ${comment}|comment_like_ip:ip %}
                                                    <i class="fas fa-heart" style="color: #BE0E61;"></i>
                                                    {% else %}
                                                    <i class="far fa-heart"></i>
                                                    {% endif %}
                                                    <span>${comment.likes}</span></a></p>
                                                <button style="background-color: black;" class="reply" data-id="${comment.id}" data-parent=${comment.get_parent}>Ответить</button>
                                                <form action="" method="POST" class="comment-form" id="form-${comment.id}" style="display:none;">
                                                    <textarea type="text" name="comment-text">
                                                    </textarea>
                                                    <br>
                                                    <input type="submit" class="btn submit-reply" data-id="${comment.id}" data-submit-reply="${comment.get_parent}" value="Отправить"/>
                                                </form>
                                            </div>`
                    } else {
                        comments.innerHTML += `<div class="comment">
                                                ${comment.nickname} | ${comment.timestamp}
                                                <p>${comment.text}</p>
                                                <p><a href="#" class="like-comment" data-id="${comment.id}">
                                                    {% if True %}
                                                    <i class="fas fa-heart" style="color: #BE0E61;"></i>
                                                    {% else %}
                                                    <i class="far fa-heart"></i>
                                                    {% endif %}
                                                    <span>${comment.likes}</span></a></p>
                                                <button style="background-color: black;" class="reply" data-id="${comment.id}" data-parent=${comment.get_parent}>Ответить</button>
                                                <form action="" method="POST" class="comment-form" id="form-${comment.id}" style="display:none;">
                                                    <textarea type="text" name="comment-text">
                                                    </textarea>
                                                    <br>
                                                    <input type="submit" class="btn submit-reply" data-id="${comment.id}" data-submit-reply="${comment.get_parent}" value="Отправить"/>
                                                </form>
                                            </div>`
                    }
                       
                }) 
                if(max_size) {
                    console.log('Done')
                }
            },
            error: function(error){
                console.log(error)
            }
        })
    }

    handleGetData()
    loadBtn.addEventListener('click', ()=>{
        visible += 3
        vis = {
            num : visible,
        }
        handleGetData()
    })
})

错误：无法解析某些字符：|${comment}||comment_like_ip:ip

我的自定义模板标签：

@register.filter
def comment_like_ip(value, arg):
    if CommentLike.objects.filter(ip__ip=arg).filter(comment__id=value).exists():
        return True
    else:
        return False

Answer 1

您需要为模板引擎创建一个字符串：

{% if '${comment}'|comment_like_ip:ip %}

编辑：我以为你试图用这个生成 JavaScript 代码。 您需要了解，django-templates 和 js 是完全独立的层。

JS在客户端。

Django在服务器端。

当您在 JS 中设置变量时，就像在上面的示例中一样，会发生这种情况......

• django 的模板渲染完成后的方式。
• 在用户的计算机上，在他们的浏览器中，而不是在您的服务器上。

我会将该过滤器实现为 js 函数并让它在客户端运行。 如果您确实需要服务器进行该计算，您可以在服务器上为其创建一个 API 并使用 fetch 从 js 调用该 API，或者您可以预先进行计算并将其结果保存为评论对象的属性。