为什么类激活不在第二个循环上工作？

Question

My code is like this :

<div class="row no-gutter">
    <div class="col-md-3">
        <h2 class="nav-cat-text">By Players</h2>
    </div>
    <div class="col-md-9 col-xs-12">
        <div class="wrap-tabs">
            <ul class="nav nav-tabs nav-cat">
                @foreach($categories as $category)
                    @if($category->parent_id == 1)
                    <li role="presentation" class="{{ $loop->first ? 'active' : '' }}"><a href="javascript:;" data-toggle="tab">{{ ucfirst($category->name) }}</a></li>
                    @endif
                @endforeach
            </ul>
        </div>
    </div>
</div>

<br>
<!-- By Types -->
<div class="row no-gutter">
    <div class="col-md-3">
        <h2 class="nav-cat-text">By Types</h2>
    </div>
    <div class="col-md-9 col-xs-12">
        <div class="wrap-tabs">
            <ul class="nav nav-tabs nav-cat">
                @foreach($categories as $category)
                    @if($category->parent_id == 2)
                    <li role="presentation" class="{{ $loop->first ? 'active' : '' }}"><a href="javascript:;" data-toggle="tab">{{ ucfirst($category->name) }}</a></li>
                    @endif
                @endforeach
            </ul>
        </div>
    </div>
</div>

By players and by types, each has five tabs

When the code is executed, the first tab on by players is active

But why the first tab on by types is not active?

Answer 1

Its look like you make mistake in if condition look in first loop you use this condition

 @if($category->parent_id == 1)

and in second one you use this

 @if($category->parent_id == 2)

so in By Types first is not active