拆分HTML中的樹枝條件

Question

我想for循環

{% if count % 2 == 0 %} 
    <div class="col-md-6"><!--start block--> 
     <div class="item-small gutter-bottom"> 
      <img src="{{ item.image_url }}"/> 
      <div class="item-title">{{ item.name }}</div> 
     </div> 
{% else %} 
     <div class="item-small gutter-bottom"> 
      <img src="{{ item.image_url }}"/> 
      <div class="course-title">{{ item.name }}</div> 
     </div> 
    </div><!--end block--> 
{% endif %} 

這裏我把額外的div包裹每兩個項目做這裏面。但是，如果以HTML格式呈現，結束標記全部錯誤，輸出結果不令人愉快。

Answer 1

我會以這種方式做到這一點（我放了環的自己的例子）：

{% for i in 0..9 %} 
    {% if loop.index0 % 2 == 0 %} 
    <div class="col-md-6"><!--start block--> 
     <div class="item-small gutter-bottom"> 
      <img src="{{ item.image_url }}"/> 
      <div class="item-title">{{ item.name }}</div> 
     </div> 
    {% else %} 
     <div class="item-small gutter-bottom"> 
      <img src="{{ item.image_url }}"/> 
      <div class="course-title">{{ item.name }}</div> 
     </div> 
    </div><!--end block--> 
    {% endif %} 
{% endfor %} 

你需要採取有關環路的指標小心，因爲如果「如果」的代碼不是先呈現，你呈現的html不會好，如果在最後一次迭代中沒有呈現'else'代碼，也會發生同樣的情況。

Answer 2

您應該使用小枝的batch方法。

{% for row in items|batch(2) %} 

    <div class="col-md-6"><!--start block--> 

     {% for item in row %} 

      <div class="item-small gutter-bottom"> 
       <img src="{{ item.image_url }}"/> 
       <div class="item-title">{{ item.name }}</div> 
      </div> 

     {% endfor %} 

    </div><!--end block--> 

{% endfor %}