0

最終出力が次のようになるように、HAML で 2 つの列をレンダリングする必要があります。

<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 のサラウンドメソッドを使用しようとしましたが、条件で2 つの列をネストする方法がわかりません。HTML では、コンテナの開始タグと終了タグに対して 2 つの条件を記述するだけで済みます。それを行うためのHAMLの方法はありますか?

4

2 に答える 2

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' } 
于 2013-10-15T08:35:43.430 に答える
0

サラウンドタグを使用してそれを行いたい場合は、次のようにする必要があります。

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

ただし、できるからといって、そうしなければならないわけではありません。HAML の主張されている 2 つの利点は、読みやすさと、有効な HTML/XML を生成するという保証です。この場合、可読性を損なうコードを導入しているだけでなく、有効な HTML/XML を作成できないバグを発生させる簡単な機会を提供しています。

代わりに if ステートメントを使用し、パーシャルを使用して重複を減らすことをお勧めします。別の方法は、代わりに ERB を使用することです。これにより、条件付きで親要素を含めることができます。

于 2013-10-15T08:30:33.470 に答える