Laravelでカラムの値が配列のデータをビューに表示する方法

Laravelでカラムの値が配列のデータをビューに表示する方法

131 回閲覧されました

みなさんこんにちは、joinioです。

Laravelを使っている時にカラムの値が配列になっているデータをビューに表示したいと思いました。

また一部のカラムのみ配列になっているデータがあって配列ではないデータと配列のデータを同時に表示したい時もあったのですが調べたりChatGPTに質問しても微妙だったのでやり方のメモとしてこの記事を残します。

今回使うテーブルのデータ

下記になります。

choicesカラムの値が配列になっていますがこれを表示します。

まずはカラムの値が配列の時のみをビューに表示する方法を説明します。

カラムの値が配列のデータのみを表示する方法

コントローラーは下記にします。(モデル名はQuestionです。アクションはご自身に合わせて下さい。)

public function index(){
  $questions = Question::all();

  return view('admin.index', compact('questions'));
}

ビューのコードは下記にします。

@foreach($questions->choices as $index => $choice)
<div>
  <label for="choices">
  <input id="choices" class="is-inline-block mb-3" type="radio" name="choice" value="{{ $index }}" required>
    {{ $choice }}
   </label>
 </div>
 @endforeach

テーブルの値をビューに表示する時の通常のコードは下記になります。

@foreach($questions as $question)
  {{ $question->question }}
@endforeach

上記の例はasのあとにある「$question」を使って「{{ $question->カラム名 }}」でテーブルのデータを表示しますが配列のデータを表示する時は「=>」のあとにある「$choice」で表示します、「choices」は配列のデータのカラム名です。

「as $index」の「$index」は配列のインデックス番号に該当します。

これでカラムの値が配列の時に配列の中の値を1つずつ表示できます。

次はテーブルの値が配列の時とそうでない時を同時に表示する時のやり方です。

カラムの値が配列の時とそうでない時を同時に表示する方法

ビューのコードを下記にします。(コントローラーは同じです)

<table border="1" class="mr-auto ml-auto mt-6">
   <tr>
     <th class="pl-6 pr-6 pt-4 pb-4">問題文</th>
     <th class="pl-6 pr-6 pt-4 pb-4">選択肢</th>
   </tr>
   @foreach($questions as $question)
     <tr>
       <td class="pl-6 pr-6 pt-4 pb-4">{{ $question->question }}</td>
       <td class="pl-6 pr-6 pt-4 pb-4">
         @foreach($question->choices as $index => $choice)
         <p>選択肢{{$index + 1}} : {{$choice}}</p>
         @endforeach
       </td>
     </tr>
    @endforeach
</table>

最初にテーブルのデータを表示する為の記述をします。

@foreach($questions as $question)
    
@endforeach

そして上記の2行目の部分にカラムの値が配列の時のデータの値を表示する為の記述をします。

@foreach($question->choices as $index => $choice)
  <p>選択肢{{$index + 1}} : {{$choice}}</p>
@endforeach

これはカラムの値が配列の時のデータを表示する時と同じです。

これで下記のようにデータが表示されているのが確認できます。