如何在pug中插入变量字符串

How do I interpolate variable string in pug?

本文关键字：插入 变量 字符串 pug      更新时间：2023-09-26

在下文中，myVar包含字符串"Today, it's the ${date}"。此外，还有一个名为date的变量，其中包含"1st of October"。我希望下面的pug语法将文字${date}替换为date变量内容。

span!= myVar
不幸的是，这个例子的结果是 
<span>Today, it's the ${date}</span>

预期结果: 

<span>Today, it's the 1st of October.</span>

最诚挚的问候,Benedikt

是的，正如@omgninjas指出的那样，它被称为插值，在Pug中前面加#。

然而，你不能总是使用它(例如:在字符串中)。下面是一些例子:

sensor是控制器传递给视图的变量。

  1. 正常的插值。按预期工作:

<div id=#{sensor} style="width:90%;height:250px;"></div>

  • 在带有模板字面值的字符串内部(不要与用户提供的值一起使用):

    • img(src=`/images/${sensor}.png`, style="width:20%")

  • 在用于表示函数调用的字符串内部。注意，你不能在函数调用中使用'符号(反勾号也就是模板字面量中使用的重音)，因为你必须覆盖整个函数调用。这将导致一个不会被执行的字符串。你需要使用字符串连接。

    • body(onload="initTemp('"+ sensor +"')")

    下面是Pug插值的官方文档:https://pugjs.org/language/interpolation.html

    希望这对你有帮助。随时欢迎指正和建议!

    要在Pug模板中直接以字符串形式呈现变量，可以使用典型的ES6插值。示例(假设pageTitle在作用域中，并作为模板上下文传递):

     - var pageTitle = `Google | ${pageTitle}`;

    Pug使用散列插入。#{插值}

    相关文章：