Laravel: blade foreach looping bootstrap columns

问题

I have a foreach loop and inside that contains html with bootstrap columns.

@foreach($address as $add)
    <div class="col-md-6">
        Some data
    </div>
@endforeach

However, bootstrap requires the row div before creating columns, placing that straight in to the foreach loop would create a row div for each col-md-6. I want to know how I can throw in the row div, skip the next loop throwing in only the closing div tag. And then repeat that process.

Example output where the loops 4 times:

<div class="row">
    <div class="col-md-6">
        Some data
    </div>
    <div class="col-md-6">
        Some data
    </div>
</div>
<div class="row">
    <div class="col-md-6">
        Some data
    </div>
    <div class="col-md-6">
        Some data
    </div>
</div>

回答1:

As an alternative to Alexey Mezenin's answer you could use array_chunk instead. http://php.net/manual/en/function.array-chunk.php

@foreach(array_chunk($address, 2) as $chunk)
    <div class="row">
        @foreach($chunk as $add)
            <div class="col-md-6">
                Some data
            </div>
        @endforeach
    </div>
@endforeach

I personally find the the above a little more readable.

Alternatively, if $address is a collection you could do $address->chunk(2) instead of array_chunk($address, 2).

If you want to change the amount of columns you have you would simply need to change the 2 to be however many columns you want.

回答2:

Use the $loop variable:

<div class="row">
    @foreach($address as $add)
        <div class="col-md-6">
            Some data
        </div>
        @if ($loop->iteration % 2 == 0)
            </div>
            <div class="row">
        @endif
    @endforeach
</div>

回答3:

You can use Laravel chunk in the blade template.

@foreach($products->chunk(3) as $items)
<div class="row">
   @foreach($items as $item)
   <div class="col-md-4 portfolio-item">
      <a href="#">
      <img class="img-responsive" src="{{ 'uploads/'.$item->product_image_url }}" alt="">
      </a>
      <h3>
         <a href="/view-product-details/{{ $item->id }}">{{ $item->product_name }}</a>
      </h3>
      <p>{{ str_limit($item->product_description, 121) }}</p>
   </div>
   @endforeach
</div>
@endforeach

Copied from the blogpost.

来源：https://stackoverflow.com/questions/41650670/laravel-blade-foreach-looping-bootstrap-columns