I cannot get Jade to indent the code in the for loop correctly:
div.container
- var cell = 0
- for(var i = 0; i < results.Items.Item.length; i++)
- if(cell == 0)
div.row
div.span3
div.cell
span #{results.Items.Item[i].ItemAttributes.Title}
- else
div.span3
div.cell
span #{results.Items.Item[i].ItemAttributes.Title}
- if(cell < 3)
- cell++;
- else
- cell = 0
The code in the else statement does not go inside div.row but instead renders under div.container, or on the same level as div.row. I need the code in the else statement to render inside div.row. How can I get Jade to do this?
What I'm trying to do is to get div.row to render and then after every 4th div.cell (as counted by the cell object) render another div.row
I believe you have to do it like this:
div.container
- var cell = 0
- for(var i = 0; i < results.Items.Item.length; i++)
div.row
div.span3
div.cell
span #{results.Items.Item[i].ItemAttributes.Title}
- if(cell < 3)
- cell++;
- else
div.row
- cell = 0
use curly braces "{" and "}"
div.container
- var cell = 0
- for(var i = 0; i < results.Items.Item.length; i++){
- if(cell == 0){
div.row
div.span3
div.cell
span #{results.Items.Item[i].ItemAttributes.Title}
- }
- else{
div.span3
div.cell
span #{results.Items.Item[i].ItemAttributes.Title}
- }
- if(cell < 3)
- cell++
- else
- cell = 0
- }