在两个引导列（同一行）Laravel中显示Eloquent数据

Question

I need some help with this blade template, it's for the homepage of a non-profit organisation, I have pulled all their categories on the homepage and i can drill down in the relationship to get the desired news but I have a issue in my loop or something, let me explain, I have one main block with two columns in each column I would like to display 4 news related to that category, but my loop reproduces on each column the same output, how do I get 2 columns with 8 news correctly formated, by that I mean no duplication of entries on output, thanks ahead.

visual example

HomeController

$categories = Category::with('latestNews') ->orderBy('name', 'asc') ->take(9) ->get();

Blade Template

<!-- block_inner -->
<div class="block_inner row">
    <!-- small_list_post -->
    <div class="small_list_post col-lg-6 col-md-6 col-sm-6 col-xs-6">
        <ul>
         @foreach( $category->latestNews->take(8) as $news)         
            <li class="small_post clearfix">
            @if($news->Image_Thumb_Url)
                <div class="img_small_post">
                    <img src="{{$news->Image_Thumb_Url}}" alt="{{$news->title}}">
                </div>
            @endif
                <div class="small_post_content">
                    <div class="title_small_post">
                        <a href="#"><h5>{{ str_limit($news->title, 60, ' ...') }}</h5></a>
                    </div>
                    <div class="post_date"><i class="fa fa-calendar"></i> <em><a href="#">{{$news->created_at->diffForHumans()}}</a></em></div>
                </div>
            </li>
        </ul>
    </div>
    <!-- // small_list_post -->

    <!-- small_list_post -->
    <div class="small_list_post col-lg-6 col-md-6 col-sm-6 col-xs-6">
        <ul>
            <li class="small_post clearfix">
            @if($news->Image_Thumb_Url)
                <div class="img_small_post">
                    <img src="{{$news->Image_Thumb_Url}}" alt="{{$news->title}}">
                </div>
            @endif
                <div class="small_post_content">
                    <div class="title_small_post">
                        <a href="#"><h5>{{ str_limit($news->title, 60, ' ...') }}</h5></a>
                    </div>
                    <div class="post_date"><i class="fa fa-calendar"></i><em><a href="#"> {{$news->created_at->diffForHumans()}}</a></em></div>
                </div>
            </li>
        @endforeach
        </ul>
    </div>
    <!-- // small_list_post -->
</div>

Answer 1

First you made an error in foreach statement which is breaking html code.

try this:

<!-- block_inner -->
    <div class="block_inner row">
    @foreach($category->latestNews->take(8)->chunk(4) as $newsChunk)
    <!-- small_list_post -->
    <div class="small_list_post col-lg-6 col-md-6 col-sm-6 col-xs-6">
        <ul>
            @foreach($newsChunk as $news)
            <li class="small_post clearfix">
            @if($news->Image_Thumb_Url)
                <div class="img_small_post">
                    <img src="{{$news->Image_Thumb_Url}}" alt="{{$news->title}}">
                </div>
            @endif
                <div class="small_post_content">
                    <div class="title_small_post">
                        <a href="#"><h5>{{ str_limit($news->title, 60, ' ...') }}</h5></a>
                    </div>
                    <div class="post_date"><i class="fa fa-calendar"></i> <em><a href="#">{{$news->created_at->diffForHumans()}}</a></em></div>
                </div>
            </li>
            @endofreach
        </ul>
    </div>
    <!-- // small_list_post -->
    @endforeach
</div>