2014-03-31 3 views
0

비취와 부트 스트랩에 문제가 있습니다. 나는이 형식에 일부 HTML 레이아웃하려고 :Jade 템플리트의 닫기 태그를 지연시키는 방법은 무엇입니까?

<bootstrap row> 
    <bootstrap col-sm-6> 
    <bootstrap col-sm-6> 
</bootstrap row> 
<bootstrap row> 
    <bootstrap col-sm-6> 
    <bootstrap col-sm-6> 
</bootstrap row> 

등 ...

나는 그러나 나는 그것이 내가 그것을 할 방법을 확실히 동작하지 않습니다이가 각 문장 내에서 발생해야합니다. 내가 얻을 수 있도록 각 반복 한 후 행을 닫는 유지 :

<bootstrap row> 
    <bootstrap col-sm-6> 
</bootstrap row> 
<bootstrap row> 
    <bootstrap col-sm-6> 
</bootstrap row> 

이 옥 템플릿 내가 현재 가지고 있습니다 :

div.col-sm-12 
    #items 
    - each item, x in items 
     div.article.col-sm-6 
     div.title 
      h3= item.name + " (" + item.cost + ")" 
      p= item.stats 
      p= item.recipe 
      p= item.ability 
      p= "Purchased from " + item.category 

그래서 각 2 반복, 나는 두 col-을 포장 할 필요가 sm-6 항목 연속.

도움을 주시면 감사하겠습니다.

감사합니다.

답변

2

색인을 생성 할 때 item 만 렌더링하면 그 조건 내에서 다음 항목이 렌더링됩니다. 뭔가 같이 :

.col-sm-12     
    #items      
    - var items = ['a', 'b', 'c', 'd'] 
    - each item, index in items 
     if 0 === index % 2 
     .row     
      - var nextItem = items[index + 1] 
      .col-sm-6= item                                 
      .col-sm-6= nextItem 

출력 : 당신의 item 이후 물론

<div class="col-sm-12"> 
    <div id="items"> 
    <div class="row"> 
     <div class="col-sm-6">a</div> 
     <div class="col-sm-6">b</div> 
    </div> 
    <div class="row"> 
     <div class="col-sm-6">c</div> 
     <div class="col-sm-6">d</div> 
    </div> 
    </div> 
</div> 

nextItem는 적절한 마크 업을 각각 렌더링하는 부분을 사용해야 할 수도 있습니다 예를 들어 간단하지 않습니다 그것의 가치를 위해.

관련 문제