html - 在每个偶数列上以 HAML 显示容器

Question

我需要在 HAML 中呈现两列，以便最终输出为：

<div class='wrapper'>
  <div class='container'>
    <div class='left'>
      Some stuff's contents...
    </div>  
    <div class='right'>
      Some other stuff's contents...    
    </div>      
  </div>  
</div>

显然以下行不通。

.wrapper
  - @stuff.each_with_index do | stuff, index |
    - if index % 2 == 0
      .container
        = render 'stuff_partial', :stuff => stuff
    - else
      = render 'stuff_partial', :stuff => stuff

我尝试使用 HAML 的环绕方法，但我不明白如何让两列嵌套在条件中？在 HTML 中，您只需为容器的开始标签和结束标签编写两个条件，仅此而已。HAML 中是否有任何方法可以做到这一点？

Answer 1

所以我在那里找到了答案的方向。答案是，

.wrapper
  - @stuff.each_slice(2) do | stuff |
    .container
      - stuffs.each_with_index do | stuff, index |
        - if index % 2 == 0
          = render 'stuff_partial', :locals => { :stuff => stuff, class => 'left' } 
        - else
          = render 'stuff_partial', :locals => { :stuff => stuff, class => 'right' } 

Answer 2

如果您想使用环绕标签执行此操作，则必须这样做：

.wrapper
  - @stuff.each_with_index do | stuff, index |
    - surround(index % 2 ? "<div class='container'>" : "", index % 2 ? "</div>" : "") do
      = render 'stuff_partial', :stuff => stuff

但是，仅仅因为您可以做到，并不意味着您应该这样做。HAML 的两个声称的好处是易于阅读和保证它生成有效的 HTML/XML。在这种情况下，您正在引入损害可读性的代码，并提供了一个容易的机会来产生一个阻止您拥有有效 HTML/XML 的错误。

我的建议是改用 if 语句并使用 partials 来减少重复。另一种方法是改用 ERB，它允许您有条件地包含父元素。