2

我正在尝试在.each循环中使用 HAML 生成以下代码。根据循环中的真/假条件，它应该使用 a 创建一个新div1的div2或附加div2在前一个中div1。这是逻辑的简化：

Desired output:

if true, append `div2` within `div1`, 

    <div class="div1">    #added by true condition
      div1 text
      <div class="div2">  #added by true condition
        div2 text
      </div>
      <div class="div2">  #added by false condition
        div2 text
      </div>
      <div class="div2">  #added by false condition
        div2 text
      </div>
    </div>

else, create a new `div1` and add `div2` within it

    <div class="div1">    #added by true condition
      div1 text
      <div class="div2">  #added by true condition
        div2 text
      </div>
    </div>
    <div class="div1">    #new div1, added by true condition
      div1 text
      <div class="div2">  #added by true condition
        div2 text
      </div>
    </div>

实际上，我正在尝试这样做

  //within a loop logic
    - if condition == true
      .div1
        div1 text
    -# in all conditions
        .div2
          div2 text

这是我使用的 HAML 逻辑，tab_up但我认为这不是正确的 HAML 方法：

  //within a loop logic
    - if condition == true
      .div1
        div1 text
    - tab_up(2)  #trying to indent the HAML, not just the HTML output
    .div2
       div2 text
4

1 回答 1

0

在 Haml 中执行此类操作的方法是在将数据转换为 HTML 之前对其进行组织。的方法在Enumerable这里可以提供帮助。

您描述问题的方式，将您的可枚举拆分slice_before为最直接的解决方案 - 您希望div1在条件为真的每个项目之前打开一个新的（这里我假设条件取决于项目）。可能是这样的：

- items.slice_before {|item| determine_condition(item) }.each do |div1_block|
  .div1
    div1 text
    - div1_block.each do |item|
      .div2
        div2 text

根据您实际尝试执行的操作，可能有更好的方法来组织您的数据——这里描述的方式表明您正在以低于需要的级别查看它，因为您已经在考虑迭代和随时创建 HTML。

基本思想是获取一个（或Enumerator）数组，每个内部数组代表 a 的内容div1。哈姆尔然后很容易掉出来。chunk，each_slice并且group_by是一些Enumerable可能值得一看的方法。

于 2013-10-04T11:55:41.250 回答