ブートストラップカルーセルのスライド1枚につき3枚のゲームカード

Question

私は1枚のスライドに3枚のカードがあるページにブートストラップカルーセルを持っていますが、ハードコードされています。どうすればそれらを動的にすることができますか？私はdbからゲームカードを取る必要があります。これは今私が持っているものです：

<div id="carousel" class="carousel-inner thumb-inner"> 
    <div class="active item"> 
    <div class="col-lg-12 col-md-12 col-xs-12 slide1 slider-div"> 
     <div class="game-card">Some content here</div> 
     <div class="game-card">Some content here</div> 
     <div class="game-card">Some content here</div> 
    </div> 
    </div> 
    <div class="item"> 
    <div class="col-lg-12 col-md-12 col-xs-12 slide1 slider-div"> 
     <div class="game-card">Some content here</div> 
     <div class="game-card">Some content here</div> 
     <div class="game-card">Some content here</div> 
    </div> 
    </div> 
</div> 

ここにルビコードを入れる正しい方法は何ですか？私の考えは優しさでした。このように：

<div class="active item"> 
    <div class="col-lg-12 col-md-12 col-xs-12 slide1 slider-div"> 
    <% Game.all.each_with_index do |game, index| %> 
     <div class="col-lg-4 col-md-4 col-sm-4"> 
     <%= game.title %> 
     </div> 
    <% end %> 
    </div> 
</div> 

しかし、これは私のスライド上のすべてのゲームカードを提供します。 1枚のスライドに3枚のゲームカードを作る正しい方法は何ですか？ありがとう。

Answer 1

ここでlimitとoffsetを使用すると、一度に3つのレコードを取得できます。たとえば：

---

ゲームテーブルはメモリにのみ快適にフィットするレコードの数が少ない場合は

Game.offset(0).limit(3) # first 3 items 
Game.offset(3).limit(3) # next 3 items 

は、あなたもこのような何かを行うことができ：これは利点があり

items = Game.all.to_a # do this once to load up all the records 
items.shift(3)   # call repeatedly to get the next 3 items 

ことあなたはアイテムを前もってランダム化することができますGame.order("RANDOM()").to_a