html – 在Jade-Template中使用if条件的每个循环

HEJ.

我正试图在开头和每第9个元素之后写一个tr.
为此,我使用模数运算符,如上例所示.
但是,如果我想在其中使用else条件将td写入同一个tr中,例如它会创建另一个tr.

有人看到了什么问题吗？或者它如何运作？

代码示例

extends layout.jade

    block body  
       table  
         each result,i in results
         if (i%9==0)
           tr
             td.ranking
             div.rank
                p=(i+1)+'.'
                div.points
                   p=result.points
                div.person                              
                   p.name=result.name
                   p=result.company  
         else
             td.ranking
             div.rank
                p=(i+1)+'.'
                div.points
                   p=result.points
                div.person                              
                   p.name=result.name
                   p=result.company

HTML输出

解决方法

其中一个解决方案如下：

假设您的快速处理程序中有一个变量结果：

var results =  ['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r'];

请注意,这可能是一个对象数组.为简单起见,我使用了从`到r的字符串.

让我们将该数组拆分为行和列的二维数组：

var results2d = [];
while(results[0]) {
     results2d.push(results.splice(0,9));
}

我总是喜欢在快速处理程序中执行所有转换,以减少模板内额外的代码行数.

所以你的results2d如下：

[ [ 'a','h' ],[ 'i','p' ],[ 'q','r' ] ]

然后你可以将它传递给Jade模板：

res.render('templateId',{ results:results2d  });

在模板内部,您的代码可能如下所示：

table  
    - var i = 1;
    each result in results
        tr
            each item in result
                td.ranking
                    div.rank
                        p=(i++)+'.'
                        div.points
                            p=result.points
                        div.person                              
                            p.name=result.name
                            p=result.company

您的HTML输出如下：

我希望这会有所帮助.