是否可以将变量作为CSS类传递给Django html模板？

Question

几乎是一个Django-any-PythonNoob-学习了一个月左右，看了教程…所以我知道这很危险。我试图在一个HTML模板中随机化CSS类。我正在使用一个定制的引导模板将数据库条目显示为卡片，并且我想随机设置背景。我已经掌握了一些基本知识，但是还没有弄清楚如何在实际的html模板中随机设置CSS类的值。在

我尝试过在相关的Django视图模板中随机设置值。搜索了2.2文档、stack、google等，但到目前为止没有任何乐趣

在视图.py公司名称：

import random

from django.shortcuts import render

from compliments.models import Compliments

def compliment(request):
    compliment = Compliments.objects.all()
    return render(request, 'compliments/home.html', {'compliment': compliment})

    classList = [
        'bg-secondary', 'bg-success', 'bg-danger', 'bg-warning',
        'bg-info', 'bg-light', 'bg-dark'
    ]
    css_class = random.choice(classList)

我的HTML:

^{pr2}$

我希望我可以从我的视图中得到“css_class”以显示在{HTML模板中complment.css_类}}，但是检查类属性可以发现它根本没有被呈现（只是空白）。在

Answer 1

这是经过HenryM和Django文档的Custom template tags and tilters部分指导后的工作版本。在

myapp/模板标签/我的标签.py公司名称：

import random

from django import template

register = template.Library()

classList = [
    'bg-secondary', 'bg-success', 'bg-danger', 'bg-warning', 'bg-info',
    'bg-light', 'bg-dark'
]


@register.filter
def random_css(a):
    return random.choice(classList)

相关章节视图.py公司名称：

^{pr2}$

以及呈现它的HTML：

{% extends 'accounts/base.html' %}
{% load mytags %}

{% block body %}

<div class="row">
    <div class="col-12">
        <h4 class="mb-4">Compliments</h4>
    </div>
    <!  end col  >
</div>
<!  end row  >
<div class="row">
  {% for compliment in compliment %}
    <div class="col-md-4">
        <div class="card {{ compliment|random_css }} text-white">
            <div class="card-body">
                <p class="card-text">{{ compliment.body }}</p>
                <a href="javascript: void(0);" class="btn btn-primary btn-sm">Select</a>
            </div>
            <!  end card-body >
        </div>
        <!  end card >
    </div>
    {% endfor %}
    <!  end col >
</div>
{% endblock%}

Answer 2

在设置css_class之前，您将到达return，并且不要将其添加到上下文中

def compliment(request):
    compliment = Compliments.objects.all()

    classList = [
        'bg-secondary', 'bg-success', 'bg-danger', 'bg-warning',
        'bg-info', 'bg-light', 'bg-dark'
    ]
    css_class = random.choice(classList)

    return render(request, 'compliments/home.html', {'compliment': compliment, 'css_class`: css_class})

创建一个模板标记（即在templatetags目录中创建以下文件，以mytags.py为例

^{pr2}$

html格式

{% load mytags %}

<div class="card {{ compliment|random_css }} text-white">