コントローラからビューへ値を渡す方法

2018/10/16

今回はコントローラで処理した変数をビューへ受け渡す方法についてエントリーします。

※配列をwithメソッドで受け渡す場合

 

学習の目的

コントローラからビュー(Blade)への値の受け渡し方法は主に三つあります。

1)view関数の第二引数
2)compact関数
3)withメソッド

 

準備

1)コントローラの作成
2)ルーティングの設定
3)ビュー(Bladeマスターファイル)の作成

 

1)コントローラの作成

artisanコマンドで以下を実行します。

php artisan make:controller TestsController

 

2)ルーティングの設定

Route::get('test', 'TestsController@index');

 

3)ビュー(Bladeマスターファイル)の作成

Bladeのマスターファイル(master_test.blade.php)を作成します。

※Bladeのブランチファイルは後述します。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>@yield('title')</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">

<!-- オプションのテーマ -->
<style>
: ※省略
</style>
</head>

<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
  <div class="container">
  <div class="navbar-header">
  <a class="navbar-brand" href="/tests/">@yield('title')</a>
  </div>
  <div id="navbar" class="collapse navbar-collapse">
  </div><!--/.nav-collapse -->
  </div>
</nav>

<div class="container" style="margin-top: 30px;">
@yield('content')
</div><!-- /container -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>

 

値の受け渡し方法:単数

1)view関数の第二引数

コントローラ

public function index() {
    return view('test.index', ['test' => 'テスト']);
}

 

ビュー

@extends('layouts.master_test')
@section('title', 'コントローラからビューファイルへの値の受け渡し方法')
@section('content')

<div class="panel panel-default">
  <div class="panel-heading">値の受け渡し方法:1)view関数の第二引数</div>
  <div class="panel-body">
  {{$test}}
  </div>
</div>

@endsection

 

出力結果

 

2)compact関数

コントローラ

public function index() {
  $test = "テスト";
  return view('test.index',compact('test'));
}

 

ビュー

※「view関数の第二引数」のBladeブランチファイルと同じ

 

出力結果

 

3)withメソッド

コントローラ

public function index() {
  $test = "テスト";
  return view('test.index')->with('test',$test);
}

 

ビュー

※「view関数の第二引数」のBladeブランチファイルと同じ

 

出力結果

 

値の受け渡し方法:複数

1)view関数の第二引数

コントローラ

public function index() {
  return view('test.index', ['test1' => 'テスト1','test2' => 'テスト2','test3' => 'テスト3']);
}

 

ビュー

@extends('layouts.master_test')
@section('title', 'コントローラからビューファイルへの値の受け渡し方法')
@section('content')

<div class="panel panel-default">
  <div class="panel-heading">値の受け渡し方法:1)view関数の第二引数(複数)</div>
  <div class="panel-body">
  {{$test1}}<br>
  {{$test2}}<br>
  {{$test3}}
  </div>
</div>

@endsection

 

出力結果

 

2)compact関数

コントローラ

public function index() {
  $test_1 = "テスト1";
  $test_2 = "テスト2";
  $test_2 = "テスト3";
  return view('test.index',compact('test_1','test_2' ,'test_3' ));
}

 

ビュー

※「view関数の第二引数(複数)」のBladeブランチファイルと同じ

 

出力結果

 

3)with関数

コントローラ

public function index() {
  return view('test.index')->with(["test1" => "テスト1", "test2" => "テスト2", "test3" => "テスト3"]);
}

 

ビュー

※「1)view関数の第二引数(複数)」のBladeブランチファイルと同じ

 

出力結果

 

値の受け渡し方法:配列

1)view関数の第二引数

コントローラ

public function index() {
  $data["test1"] = "テスト1";
  $data["test2"] = "テスト2";
  $data["test3"] = "テスト3";
  return view('test.index',$data);
}

 

ビュー

: ※省略

<div class="panel panel-default">
  <div class="panel-heading">値の受け渡し方法:1)view関数の第二引数(配列)</div>
  <div class="panel-body">
  {{ $test1 }} <br>
  {{ $test2 }} <br>
  {{ $test3 }}
  </div>
</div>

:※省略
【解説】
添え字なしの配列は上手くいきませんでした。

 

出力結果

 

2)compact関数

コントローラ

public function index() {
  $test_array = ["テスト1","テスト2", "テスト3"];
  return view('test.index',compact('test_array'));
}

 

ビュー

: ※省略

<div class="panel panel-default">
  <div class="panel-heading">値の受け渡し方法:2)compact関数(配列)</div>
  <div class="panel-body">
  {{$test_array[0]}} <br>
  {{$test_array[1]}} <br>
  {{$test_array[2]}}
  </div>
</div>

:※省略
【解説】
一番スマートな記述です。

 

3)withメソッド

コントローラ

public function index() {
  $hash = array( 'test1' => 'テスト1', 'test2' => 'テスト2', 'test3' => 'テスト3' );
  return view('test.index')->with($hash);
}

 

ビュー

:※省略
div class="panel panel-default">
  <div class="panel-heading">値の受け渡し方法:3)withメソッド(配列)</div>
  <div class="panel-body">
  {{$test1}} <br>
  {{$test2}}<br>
  {{$test3}}
  </div>
</div>
:※省略

 

出力結果

コントローラからビューへ値を渡す方法は以上になります。

本庄マサノリ

仕事で Laravel を使っています。気づいたことや新しい発見など情報を発信していきます。問い合わせはこちら

>> Twitter をフォローする

 

-基礎知識