用于迭代的Jade aka Pug语法

时间:2017-08-02 09:51:21

标签: node.js

我正在尝试使用each迭代jade中的变量。变量,在这种情况下是插值,如#{images}。该数组包含图像的URL。

我可以做img(src="#{images[0]}")而且效果很好

我尝试使用each函数并不断出现错误。这是最新的尝试。

div each image in #{images} img(src="#{image}",height="100px",width="100px")

我试过没有插值图像。和一堆其他的东西。空间或语法是否缺少我的东西?

img(src="#{images[0]}",height="100px",width="100px") 上面的工作,所以我知道我得到变量,再次这是玉的扩展。我试图将这个小项目移植到帕格但是没有用,但那是另一个故事。

这是一个非常酷的上传器中的最后一块,它使用来自浏览器的POST将图像上传到aws存储桶,同时将网址保存在mongoDB中。搞清楚这将添加一个图像库来查看上传。

1 个答案:

答案 0 :(得分:0)

所以经过多次麻烦后我才弄清楚了。当您将数组作为变量从express传输到您的jade / pug模板时,此规则应适用于大多数情况。

我的问题是我试图在images循环中插入each变量。你插入如下:#{variable}。这将生成变量的文字版本,但这不是each循环所需的。您只需要变量的名称,而不是文字值。

相反,有效的代码非常简单。

错:

each image in #{images} img(src="#{image}",height="100px",width="100px")

each image in images img(src="#{image}",height="100px",width="100px")

现在循环正在创建一个新图像,其中包含来自var images=[url,url,etc]

中每个值的src

这种玉/哈巴狗的语法起初有点令人困惑,但如果你能弄清楚它似乎很棒。