如何在Nunjucks的If Expression语句中包裹HTML

你原来的写法有两个问题：一是 Nunjucks 用 + 做字符串拼接，而非 .；二是默认会转义 HTML 标签，直接输出的话 <li> 会被转成实体字符。下面是两种正确实现方式：

方式一：使用条件表达式 + 字符串拼接 + 安全过滤器 #

{{ ("<li>" + foo + "</li>" if foo else "") | safe }}

• 用 + 替代 . 完成字符串拼接
• 用 | safe 过滤器告诉 Nunjucks 不要转义这段 HTML 内容，确保 <li> 标签能正常渲染

方式二：使用块级 {% if %} 语句（更易读，推荐） #

如果 HTML 结构更复杂，块级语法会更清晰：

{% if foo %}
  <li>{{ foo }}</li>
{% endif %}

这种写法无需额外处理转义，直接编写的 HTML 标签会被正常解析；如果 foo 本身包含 HTML 内容，可给 foo 加上 | safe 过滤器：

{% if foo %}
  <li>{{ foo | safe }}</li>
{% endif %}

内容的提问来源于stack exchange，提问作者klewis