Pug/Jade 插值不适用于属性

Question

我有一个正在渲染的页面，如下所示：

\n\n

res.render('account.pug', {user: req.user._id})\n

\n\n

\xe2\x80\x94and 应该显示与用户相对应的个人资料图片，如下所示：

\n\n

img(id='profilepicture' src='profilepictures/#{user}')\n

\n\n

然而，巴哥犬渲染为：

\n\n

<img id='profilepicture' src='profilepictures/#{users}' />\n

\n\n

\xe2\x80\x94 而不是：

\n\n

<img id='profilepicture' src='profilepictures/USERID' />\n

\n\n

\xe2\x80\x94因此不会显示正确的个人资料图片。

\n\n

这很奇怪，因为当我编写div #{user}它时，它会正确呈现为<div>USERID</div>，所以它显然与我在属性中间字符串上进行插值有关。我尝试过使用反引号而不是引号，但这也不起作用。

\n

Answer 1

正如Pug 文档中所述，#{foo}属性中不再支持插值语法。

\n\n

而不是使用\xe2\x80\x94

\n\n

img#profilepicture(src=\'profilepictures/#{user}\') // no longer supported\n

\n\n

\xe2\x80\x94你可以使用（正如@Shinigami指出的那样）：

\n\n

img#profilepicture(src=\'profilepictures/\' + user) // supported\n

\n\n

或者，如果您有 ES6 支持，则可以使用模板字符串：

\n\n

img#profilepicture(src=`profilepictures/${user}`) // supported\n

\n\n

（注意最后一个使用的${}是#{}）

\n