html - RoR/HAML/HTML 使用 ruby​​ on rails 在 html 中的第三个元素之后添加一个新行

Question

我的索引页看起来像:

.subfeatures.row
  - @collection_pages.each do |collection_page|
    %div{class: "subfeature-0#{collection_page.position} columns four"}
      = link_to collection_page do
        .img
          = image_tag collection_page.cover_image
          .content
            %h3.title
              = collection_page.link
            %hr
            %p.description View Collection >

鉴于我有 5 件元素。 这正在生成:

    <div class="sub features row">
      <div class="subfeature-01 columns four">
      <div class="subfeature-02 columns four">
      <div class="subfeature-03 columns four">
      <div class="subfeature-04 columns four">
      <div class="subfeature-05 columns four">
   </div>

我需要它以某种方式生成以下内容，几乎每一行都可以包含 3 个项目:

  <div class="sub features row">
    <div class="subfeature-01 columns four">
    <div class="subfeature-02 columns four">
    <div class="subfeature-03 columns four">
  </div>

  <div class="sub features row">
    <div class="subfeature-04 columns four">
    <div class="subfeature-05 columns four">
  </div>

有什么好的方法可以实现吗？

提前致谢!

Answer 1

使用each_slice先整理数据，Haml的结构就简单了:

- @collection_pages.each_slice(3) do |slice|
  .subfeatures.row
    - slice.each do |collection_page|
      %div{class: "subfeature-0#{collection_page.position} columns four"}