插值法(Interpolation)

¥Interpolation

Pug 提供了满足你各种不同插值需求的运算符。

¥Pug provides operators for a variety of your different interpolative needs.

字符串插值,转义(String Interpolation, Escaped)

¥String Interpolation, Escaped

考虑以下模板局部变量的放置:titleauthortheGreat

¥Consider the placement of the following template’s locals: title, author, and theGreat.

title 遵循评估本地模板的基本模式,但 #{} 之间的代码被评估、转义,并将结果缓冲到正在渲染的模板的输出中。

¥title follows the basic pattern for evaluating a template local, but the code in between #{ and } is evaluated, escaped, and the result buffered into the output of the template being rendered.

这可以是任何有效的 Javascript 表达式,因此你可以做任何感觉好的事情。

¥This can be any valid Javascript expression, so you can do whatever feels good.

Pug 足够聪明,可以找出表达式的结束位置,因此你甚至可以包含 } 而无需转义。

¥Pug is smart enough to figure out where the expression ends, so you can even include } without escaping.

如果你需要逐字包含 #{,你可以转义它,或使用插值。(太元了!)

¥If you need to include a verbatim #{, you can either escape it, or use interpolation. (So meta!)

字符串插值,未转义(String Interpolation, Unescaped)

¥String Interpolation, Unescaped

你不必谨慎行事。你也可以将未转义的值缓冲到模板中。

¥You don’t have to play it safe. You can buffer unescaped values into your templates, too.

注意

请记住,如果未转义的内容是来自用户的新鲜内容,则将未转义的内容缓冲到模板中可能会带来很大的风险。永远不要相信用户输入!

¥Keep in mind that buffering unescaped content into your templates can be mighty risky if that content comes fresh from your users. Never trust user input!

标签插值(Tag Interpolation)

¥Tag Interpolation

插值不仅适用于 JavaScript 值,也适用于 Pug。只需使用标签插值语法,如下所示:

¥Interpolation works not only on JavaScript values, but on Pug as well. Just use the tag interpolation syntax, like so:

你可以通过编写与你的 Pug 内联的 HTML 标签来完成同样的事情…但是,编写 Pug 的意义何在?将内联 Pug 标签声明封装在 #[] 中,它将被评估并缓冲到其包含标签的内容中。

¥You could accomplish the same thing by writing an HTML tag inline with your Pug…but then, what’s the point of writing the Pug? Wrap an inline Pug tag declaration in #[ and ], and it’ll be evaluated and buffered into the content of its containing tag.

空白控制(Whitespace Control)

¥Whitespace Control

标签插值语法对于内联标签特别有用,其中标签前后的空格很重要。

¥The tag interpolation syntax is especially useful for inline tags, where whitespace before and after the tag is significant.

然而,默认情况下,Pug 会删除标签前后的所有空格。查看以下示例:

¥By default, however, Pug removes all spaces before and after tags. Check out the following example:

有关此主题的更多讨论,请参阅 纯文本 页面中的空白部分。

¥See the whitespace section in the Plain Text page for more discussion on this topic.

属性插值(Attribute Interpolation)

¥Attribute Interpolation

注意

以前版本的 Pug/Jade 支持插值语法,例如:

¥Previous versions of Pug/Jade supported an interpolation syntax such as:

a(href="/#{url}") Link

不再支持此语法。替代方案如下。(有关 Pug v2 和以前版本之间其他不兼容性的更多信息,请查看我们的[迁移指南]。)

¥This syntax is no longer supported. Alternatives are found below. (Check our [migration guide] for more information on other incompatibilities between Pug v2 and previous versions.)

你可以使用以下一些替代方法在属性中包含变量:

¥Here are some alternatives you can use to include variables in your attribute:

  1. 只需在 JavaScript 中编写属性:

    ¥Simply write the attribute in JavaScript:

  2. 如果你的 JavaScript 运行时支持 ES2015 [模板字符串](包括 Node.js/io.js 1.0.0 及更高版本),你还可以使用其语法来简化你的属性:

    ¥If your JavaScript runtime supports ES2015 [template strings] (including Node.js/io.js 1.0.0 and later), you can also use its syntax to simplify your attributes:

Pug 中文网 - 粤ICP备13048890号