メインコンテンツへスキップ

blocs/blocs: 繰り返し処理(data-loop)

blocs/blocs: 繰り返し処理(data-loop)

data-loop 属性を使って、配列やオブジェクトの要素数に応じてタグを繰り返し表示します。配列名の単数形で各要素にアクセスできます。タグ記法・コメント記法の両方で使用可能です。

サンプルコード

<tr data-loop=$people>
    <td><!-- $loop->index --></td>
    <td><!-- $person->name --></td>
    <td><!-- $person->age --></td>
</tr>

コメント記法:

<!-- data-loop=$people -->
<tr>
    <td><!-- $loop->index --></td>
    <td><!-- $person->name --></td>
    <td><!-- $person->age --></td>
</tr>
<!-- data-endloop -->

Laravelのループ変数($loop->index$loop->first$loop->last)が使用できます。

ネストしたループでの親変数の参照

data-loop をネストした場合、内側のループに入ると外側のループ変数は $parent スタックに自動保存されます。内側のループが終了すると、外側の変数が自動的に復元されます。これにより、ネストしたループ内でも外側の変数にアクセスできます。

data-assign で変数名を指定する方法

配列名が単複同型(例: $knowledge, $news)の場合や任意の変数名で要素にアクセスしたい場合は data-assign を使います。

<tr data-loop=$knowledge data-assign=$item>
    <td><!-- $loop->index --></td>
    <td><!-- $item->name --></td>
    <td><!-- $item->age --></td>
</tr>

data-loop と data-convert の併用

data-loopdata-convert を付けると、ループ実行前に配列全体を指定した変換関数で加工します。

<tr data-loop=$items data-convert="sortByName">
    <td><!-- $item->name --></td>
</tr>

data-form によるループ内フィールド名の変換

ループ内のフォーム部品で data-form(または省略記法 !fieldName)を使うと、配列インデックス付きの name 属性へ自動変換されます。バリデーションも同様に配列形式で適用されます。

<tr data-loop=$users>
    <td><input type="text" name="name">
    <!-- !name="required" -->
    </td>
</tr>