Django自定义过滤器CSS使用问题：需移除HTML标签保留样式文本

方案1：标记过滤器输出为安全HTML #

Django默认会自动转义过滤器返回的HTML内容，导致标签以纯文本形式显示。我们可以通过两种方式告诉Django这段HTML是安全的，无需转义：

方法1.1：给过滤器装饰器添加is_safe=True参数 #

from django.template import Library

register = Library()

@register.filter(name='cf', is_safe=True)
def cf(amount):
    formatted_amount = f"{int(amount):,}"
    css_class = "red-text" if amount < 0 else "green-text"
    return f'<span class="{css_class}">{formatted_amount}</span>'

方法1.2：用mark_safe()包裹返回的HTML字符串 #

from django.template import Library
from django.utils.safestring import mark_safe

register = Library()

@register.filter(name='cf')
def cf(amount):
    formatted_amount = f"{int(amount):,}"
    css_class = "red-text" if amount < 0 else "green-text"
    return mark_safe(f'<span class="{css_class}">{formatted_amount}</span>')

修改完成后，模板中使用{{ amount|cf }}时，Django会直接渲染<span>标签，显示带对应颜色的格式化金额。

方案2：拆分逻辑，模板中手动控制HTML结构 #

如果想遵循逻辑与视图分离的原则，可以把功能拆成两个独立过滤器，在模板中自行构建HTML结构：

定义两个拆分后的过滤器 #

from django.template import Library

register = Library()

@register.filter(name='format_amount')
def format_amount(amount):
    return f"{int(amount):,}"

@register.filter(name='amount_class')
def amount_class(amount):
    return "red-text" if amount < 0 else "green-text"

在模板中组合使用 #

<span class="{{ amount|amount_class }}">{{ amount|format_amount }}</span>

这种方式更灵活，模板结构更清晰，也避免了过滤器与HTML结构的耦合。

内容的提问来源于stack exchange，提问作者Jamal A M