在laravel中展示产品的每个单一图像

Question

I have double tables one for products and one for files, files table have multi images related to the one product.

I want to show only one image for each product not all of them.

I make this code but it's back with the for example 3 times with the first image!

@foreach($lastProducts as $key => $lastProduct)
@if($key == 1)
<div class="bl-thumb">
<img src="{{url('website/'.$lastProduct->path.$lastProduct->->file}}">
</div>
@endif
@endforeach

I need to show the first image at my page and other pages show the second and third image for the product.

And here's my view which want to show all images on it :

<div class="slim-scroll">
    <div class="item active">
        <a href="" title="" data-lg-img="/website/images/{{$product->image_1}}" class="pic"><img src="/website/images/{{$product->image_1}}" alt="" class="img-responsive" /></a>
    </div>
    <div class="item">
        <a href="javascript:void(0)" title="" data-lg-img="/website/images/{{$product->image_2}}" class="pic"><img src="/website/images/{{$product->image_2}}" alt="" class="img-responsive" /></a>
    </div>
    <div class="item">
        <a href="javascript:void(0)" title="" data-lg-img="/website/images/{{$product->image_3}}" class="pic"><img src="/website/images/{{$product->image_3}}" alt="" class="img-responsive" /></a>
    </div>
    <div class="item">
        <a href="javascript:void(0)" title="" data-lg-img="/website/images/{{$product->image_4}}" class="pic"><img src="/website/images/{{$product->image_4}}" alt="" class="img-responsive" /></a>
    </div>
</div>

It's showing me something like that without the foreach

Answer 1

If I understand correctly, you have multiple products and each product has multiple images. If on page 1 you want to display product 1 image 1, product 2 image 1, product 3 image 1...then on page 2 you want to display product 1 image 2, product 2 image 2, product 3 image 2 you could try something like this:

Page 1:

@foreach($products as $product)
   <div class="bl-thumb">
      <img src="{{url('website/' . $product->images->pull('1')->path . $product->images->pull('1')->file}}">
   </div>
@endforeach

Page 2:

@foreach($products as $product)
   <div class="bl-thumb">
      <img src="{{url('website/' . $product->images->pull('2')->path . $product->images->pull('2')->file}}">
   </div>
@endforeach

Really this logic should be in the controller though. You could use a get variable to define what page you are on and filter for the proper image before you render the page.