[新手]Nodejs中jade用变量会出现两个尖括号的问题

h2 a(href="/blog/#{blog.id}") #{blog.title}

显示出来是这个样子

<h2><a href="/blog/5" class="score-161.9565217391304"><德国街角的微笑><!--德国街角的微笑--></a></h2>

用的是bootstrap的样式

数据库里查出来数据只是德国街角的微笑没有两边的尖括号。

在使用Jade模板引擎时，当你尝试在href属性或文本中使用变量时，输出的结果中会出现多余的尖括号。例如，在以下代码片段中：

a(href="/blog/#{blog.id}") #{blog.title}

预期的输出应该是：

<a href="/blog/5">德国街角的微笑</a>

但实际的输出却是：

<a href="/blog/5">&lt;德国街角的微笑&gt;</a>

这个问题通常是由于Jade模板引擎对特殊字符的自动转义导致的。当你在Jade模板中使用变量时，它会默认将这些变量中的特殊字符进行转义，以防止XSS攻击。

你可以通过使用!{}语法来告诉Jade不要对变量内容进行转义。这样可以确保变量中的HTML内容能够正确渲染。

以下是修正后的代码示例：

a(href="/blog/#{blog.id}") !{blog.title}

或者如果你是在渲染一个完整的HTML标签，可以这样做：

!= '<a href="/blog/' + blog.id + '">' + blog.title + '</a>'

通过使用!{}语法，你可以避免变量内容被转义，从而解决在Jade模板中使用变量时出现多余尖括号的问题。

css的问题？

具体一点把，贴下代码？

刚开始先使用ejs吧，这个和HTML比较像，容易入手，而且一些初学书籍也是ejs的

h2 a(href="/blog/#{blog.id}") #{blog.title}

显示出来是这个样子

<h2><a href="/blog/5" class="score-161.9565217391304"><德国街角的微笑><!--德国街角的微笑--></a></h2>

用的是bootstrap的样式

数据库里查出来数据只是德国街角的微笑没有两边的尖括号。

已经基本熟悉jade的基本用法了。。。

写什么样的css会在文本左右加尖括号呢。用的bootstrap基本没怎么写css。新手初到贵地，请多多指教

在 Node.js 中使用 Jade（现称为 Pug）模板引擎时，如果变量中的内容被渲染成 HTML 时出现了额外的尖括号，通常是因为 Jade 对输出进行了自动转义以防止 XSS 攻击。如果你希望输出原始的 HTML 内容而不是转义后的文本，可以使用 !{} 来替代 {}。

以下是示例代码：

h2
  a(href='/blog/#{blog.id}') !{blog.title}

在这个例子中，!{blog.title} 会确保 blog.title 中的内容不被转义，直接作为 HTML 输出。

假设你的数据库数据为：

const blog = {
    id: '5',
    title: '德国街角的微笑'
};

当使用上述代码片段时，生成的 HTML 将是：

<h2>
  <a href="/blog/5">德国街角的微笑</a>
</h2>

这样就避免了多出来的尖括号问题，并且正确地显示了链接和标题。