如何使用for循环使用bootstrap 2在每行中创建四列

Question

我已经看到了类似的问题,但所有这些都是指我不熟悉的Django和其他模板系统.但基本上我有数据被拉入,我想使用for循环在一行内创建四列并重复.然而,下面的代码可以在控制台中显示我只是一个接一个地创建了一堆'span3'.在大多数情况下,他们最终连续四张图片,但偶尔他们不会清除或连续两张图片,等等.我如何清理我的代码,以便只有四张图片'span3'连成一排然后四个循环重复？我希望代码清楚我正在使用玉.

block body
-var    maxCols = 12;
-var    col = 3;

div(ng-controller='ImgCtrl')
    div(id="wrap")
        div(id="header")
            img(src="stumblr-logo.png", height="60px")
        div(id="main_full")
            div.container
                div.row
                    -for (var i = 0; i < (media.length / col); i++)
                            div(class="span3", id="id")
                                p
                                    a(href="/single?id=#{media[i].image_id}&img=#{media[i].image}")
                                        img(src="#{media[i].image}")

Answer 1

这对我有用(使用jade with bootstrap scaffolding)

- var cols = 6, elementsInRow = 12/cols
- each _, x in myPosts
    - if ((x % elementsInRow == 0))
         div(class='row-fluid')
             - each post, y in myPosts.slice(x, x+elementsInRow)
                 include ../includes/post