使用引導程序呈現索引動作中的div

我正在用TradingCard模型構建Ruby on Rails應用程序。我有一個索引操作和相應的視圖，我試圖打印出每個TradingCard對象。這裏的基本上是我在我的控制器已經有了，我的指標作用下：使用引導程序呈現索引動作中的div

@trading_cards = TradingCard.all

這裏是我的問題：我使用的引導來幫助我完成造型的基本網格狀的方式，以及其便攜式小屏幕。我使用bootstrap來幫助總體佈局和流程，但是我爲每個TradingCard對象構建了自己的小交易卡式容器;我用自己的CSS寫了它。它沒有指定的高度，所以它可以像它需要的那樣高，以適應特定於該單個對象的所有文本。在中等大小的屏幕上，我希望我的索引視圖能夠簡單地顯示每行三張交易卡，哪裏的行不是由下面的行中的交易卡所隱藏的。這是一個問題，因爲最好的做法是簡單地包含在索引視圖下，（當然有_trading_card視圖中的文件夾部分）：

<%= render @trading_cards %>

在我_trading_card部分我有這樣的事情：

<div class="col-md-4"> 
<%= trading_card.body %> 
</div>

這種方法唯一的問題是我不能真正告訴佈局每3張交易卡創建一個新行。相反，我不得不繼續將col-md-4吐出一塊真正很長的一排，結果，一些較高的交易卡最終擠進了它們上面的行，看起來很奇怪。

有沒有更好的方法去完成這個整個方法？我錯過了什麼嗎？或者是否有一種方法可以在我的控制器中指定我想要加載3個bundle中的對象，這樣我就可以編寫一個迭代，每次循環都創建一個新行？

任何幫助是如此讚賞。對不起，如果這個問題真的很長。你們總是很有幫助，我真的不能完全感謝你們。

在此先感謝您的任何幫助！

來源

2016-04-23 Parker

好像你可以用'each_slice'來循環你的對象/項目。例如：'@ trading_cards.each_slice（3）do | cards |; end'一次需要3個對象 – Alfie

嗨Alfie，我完全不知道each_slice（）的存在。非常感謝你！ – Parker

而不是使用render @trading_cards來循環你的TradingCard s。你可以自己做3片（就像@alfie建議的那樣）。

<% @trading_cards.each_slice(3) do |cards| %> 
    <div class="row"> 
    <% cards.each do |card| %> 
     <%= render card %> <!-- This will render your `_trading_card` partial --> 
    <% end %> 
    </div> 
<% end %>

來源

2016-04-23 21:22:06 Uzbekjon

非常感謝。我不知道.each_slice（）甚至存在！我認爲這解決了我的問題。非常感謝你們的幫助！ – Parker

使用引導程序呈現索引動作中的div

回答

相關問題