【Laravel】bladeテンプレートで繰り返し処理の奇数・偶数処理を行う方法

Web制作の現場では良くある話だと思いますが、左右交互に配置してそれぞれ処理やスタイルを変える場面があります。
CSSでも、odd(奇数)、even(偶数)というセレクターが用意されていますが、スタイルだけでは立ち行かない場面もあります。
そんな時は、jsやphpを使って動的にクラスを付けたりします。

さて、
今回はLaravelのbladeテンプレート上で奇数・偶数処理を行う方法について記載します。

イントロダクション

この記事で得られること

  • Laravelのbladeテンプレート上で奇数・偶数処理を行う方法についてわかる。

環境

種類 バージョン
laravel 5.5

通常のループ

foreachで処理をループさせるて、そのループ数を取得する方法は色々あります。

カウンター変数を作る

おそらく、一般的な方法はカウンターを使う方法では無いでしょうか?
良くある簡単なループ処理は次のような方法です。

$counter = 0;
foreach($values as $key => $var) {
    if($counter % 2  == 0){
        // 偶数
    } else {
        // 奇数
    }
    $counter++
}

普通の処理であればこの方法で事足りるのですが、bladeでは変数の定義できません。
そのため、そもそもカウンターを使えません。
(ただ、これは私が見つけられなかっただけかもしれませんので、方法はある可能性もあります。)

配列のKeyをカウンターに使う

ただの配列であればkeyを回数にしてしまう方法もあります。
これであれば、bladeテンプレートにも適用できます。

@foreach($values as $key => $var)
    @if($key % 2  == 0){
        // 偶数
    @else
        // 奇数
    @endif
@endforeach

ただ、この方法では連想配列のkeyが使えません。

Laravelの場合

Laravelのbladeテンプレートでは、foreach内で使える$loopと言う変数が用意されています。
(公式のドキュメントで検索しても見つからなかったのですが、次の記事で使い方が説明されています)

mattstauffer.com

次のように、$loop->iterationでループ回数を取得することが可能です。

@foreach($values as $key => $var)
    @if($loop->iteration % 2 == 0)
        // 偶数
    @else
        // 奇数
    @endif
@endforeach

注意

明確な仕様はわかりませんが、先ほどの記事や他の情報ではLaravel5.3で追加されたようです。
それより前のバージョンでは使えない可能性もあります。

©︎2017-2018 WebSandBag