pugの "group in each element"に値が表示されない

Question

node.jsのres.renderで提供されているJSONオブジェクトからpugの動的行/ col（以前はテーブルと呼ばれていた）を読み込もうとしています。

私の問題は、簡単な値が簡単に表示されますが、動的な要素数（ここでは特定のオーディオブックのメディアファイルであることがあります）の行/列定義などのより複雑な操作は入力されません。このような私は単純に（入力フィールドに表示されたメディアタイトルとしてテンプレート内の単純な要素を、言っ

div.form-group 
    div.row 
    div.col-2 
     label(for='varMediaTitle') Titel: 
    div.col 
     input#MediaTitle.form-control(type='text', placeholder=varMediaTitle, name='varMediaTitle', required) 
div.form-group 
    div.row 
    div.col-4 
     label(for='MediaFileName') Audio Dateien: 
    div.row 
    div.col-1 Nr 
    div.col-5 Name 
    div.col-2 Groesse 
    each mediaFile in varMediaFiles 
    div.row 
     each itemM in mediaFile 
     div.col-1 
      p #{itemM.part} 
     div.col-5 
      p #{itemM.name} 
     div.col-2 
     p #{itemM.size} 
    div.row 
    div.col 
     input#MediaFileName.form-control(type='file', name='MediaFileName', required) 

として：ここで

は私のテンプレートファイルから各...ブロックとスニペットです反復なし）は正しく表示されますが、varMediaFiles内の各mediaFileを含むブロックにはコンテンツが表示されません。

興味深いことに、結果のhtmlを調べると、正しい行数がわかります。つまり、作成された行の数は、jsonファイル内の要素の数に対応します。ここで

あなたが私のNode.jsの機能からフォームに自分のコールを見ることができます：

res.render('tags', { 
       title: 'RFID Tag Datenseite', 
       headline: 'RFID Tag Daten', 
       subheadline: 'Tag ' + obj.TagId + ' - ' + obj.MediaTitle, 
       varTagId: obj.TagId, 
       varTagPreTag: obj.TagPreTag, 
       varTagChecksum: obj.TagChecksum, 
       varTagRawData: obj.TagRawData, 
       varMediaTitle: obj.MediaTitle, 
       varMediaType: obj.MediaType, 
       varMediaGenre: obj.MediaGenre, 
       varMediaDescription: obj.MediaDescription, 
       varMediaFiles: obj.MediaFileName, 
       varMediaPictures: obj.MediaPicture 
      }); 

そして、これは、JSONファイルの構造であるが（それはから読み込ま実際のファイルであります値がフォームに渡され、そこからファイルシステム）、：

{ 
    "TagChecksum": "0x97", 
    "TagId": "759C71", 
    "TagPreTag": "0xf00", 
    "TagRawData": "0F00759C7197", 
    "MediaTitle": "The 6th book", 
    "MediaType": "Audiobook", 
    "MediaGenre": "UNDEFINED", 
    "MediaDescription": "Beschreibung", 
    "MediaFileName": [{"part": "1", "name": "1st-file.mp3", "size": "6M"}, {"part": "2", "name": "2nd-file.mp3", "size": "8M"}], 
    "MediaPicture": [{"pic": "1", "name": "1st-pic.jpg"}, {"pic": "2", "name": "2nd-pic.jpg"}, {"pic": "3", "name": "3rd-pic.jpg"}] 
} 

任意のアイデア、簡単な反復作業をせずに値が、JSON配列の繰り返し処理しない理由???

私が最初に考えたのは、json構造内に配列があり、jsonファイルの形式に問題がある可能性があったからです。しかし、その場合、なぜ、各ブロックが正しく行数を作成するのか理解できません。

ただし、追加のグリッチが1つあります。 htmlの出力（添付の画像を参照）を調べたところ、実際には反復処理で正しい数の行（ここでは2つのメディアファイル）が作成されますが、各行には非常に多くの列が作成されます。すべての行のすべての列をすべての行に配置するように見えます - 非常に奇妙です。

誰もがこれにいくつかの光を当てることができますか？

敬具と多くの多くのおかげで、

クリスチャン

Answer 1

私は最終的にそれだけに価値があるかもしれません、それを考え出したと考え、この質問にまったく答えがなかったので、しかし、かなりの数の景色解決策を投稿すると、私のような他の初心者も見つけることができます。

解決策は実際には非常に簡単でした。

2回目の繰り返し（上記の質問の各itemM ...ブロック）は完全にナンセンスでしたが、私は単にそれを取り除きました。 json配列構造の中の要素を反復処理する代わりに、私はそれを直接参照しました。

私は「for」とのステートメントとして「each」を交換しましたが、これが必要かどうかはわかりません。

最後に、私の...ブロック（動作しませんでした）：私はそれを考え出したら、この理由は、かなり明確である

for mediaFile in varMediaFiles 
     div.row 
     div.col-1 
      p #{mediaFile.part} 
     div.col-5 
      p #{mediaFile.name} 
     div.col-2 
      p #{mediaFile.size} 

：

each mediaFile in varMediaFiles 
    div.row 
     each itemM in mediaFile 
     div.col-1 
      p #{itemM.part} 
     div.col-5 
      p #{itemM.name} 
     div.col-2 
     p #{itemM.size} 

は（どの作品）のために...ブロックこれになりました。ネストされた配列はありません。ネストされたeachまたはforループがおそらくトリックを行ったでしょう。私はjson要素の配列を持つjson構造を持っています。

[{"part": "1", "name": "1st-file.mp3", "size": "6M"}, {"part": "2", "name": "2nd-file.mp3", "size": "8M"}], 

この配列の各要素は、やはりjson構造です。 json構造であるため、配列要素を繰り返し処理しながら、json要素の名前を単純に参照することができます。

時には、実際にはもっと簡単なことが考えられます。

すべてにハッピーコーディング、

クリスチャン