Jade別名Pug構文の反復

Question

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") 上記のとおりですので、私は変数を取得していることを知っています、これは再び玉の拡張機能です。私はこの小さなプロジェクトをpugに移行しようとしましたが、その作業はありませんでしたが、別の話です。

これは、mongoDBにURLを保存しながら、ブラウザからPOSTを使用して画像をawsバケットにアップロードするかなりクールなアップローダの最後の部分です。これを見つけ出すと、画像ギャラリーを追加してアップロードを表示します。

Answer 1

多くの面倒さの後、私はそれを理解しました。このルールは、あなたが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を使用して新しいイメージを作成しています/ pug構文は最初は少し混乱しますが、可能であれば素晴らしいと思われますそれを理解する。