Question

我从Express和Mongoose Stack发送JSON数据，以便为在Jade中编程的UI进行渲染。我应该使用什么Jade Construct来使用Jade语法重复col-md-4的Bootstrap容器。

目前我的Jade Code如下，

 if deal
each item in deal
  .col-sm-6.col-md-4
    .thumbnail
      img(alt='100%x200', src='#{item.image_url}', style='height: 250px; width: 100%;')
      .caption

        h3 
          | #{item.brand_id}

但是我收到了错误，

Cannot read property 'image_url' of undefined

我的JSON数据就像这样发送，

Deal.find(function(err, result){
    if(err) return console.log("Error" + err);
    res.render('home',{deal:result});

}）;

从JSON格式提供的内容中重复数据块的可能解决方案是什么？

Answer 1

您的代码似乎是正确的，请确保'deal'确实填充了正确的数据。这是一个有效的例子：

- var list = [{x: 123, y: 234}, {x: 123, y: 234}];
each item in list
  .col-sm-6.col-md-4
    .thumbnail
      img(alt='100%x200', src='#{item.x}', style='height: 250px; width: 100%;')
      .caption

        h3
          | #{item.y}

输出：

<div class="col-sm-6 col-md-4">
  <div class="thumbnail"><img alt="100%x200" src="123" style="height: 250px; width: 100%;"/>
    <div class="caption">
      <h3>234</h3>
    </div>
  </div>
</div>
<div class="col-sm-6 col-md-4">
  <div class="thumbnail"><img alt="100%x200" src="123" style="height: 250px; width: 100%;"/>
    <div class="caption">
      <h3>234</h3>
    </div>
  </div>
</div>

如何在Jade中重复Bootstrap容器？

1 个答案: