- Basic Usage
- View Composers
- Blade Templating
- Other Blade Control Structures
- Blade Service Injection
- Extending Blade
Views contain the HTML served by your application, and serve as a convenient method of separating your controller and domain logic from your presentation logic. Views are stored in the resources/views directory.
A simple view looks like this:
<!-- View stored in resources/views/greeting.php -->
<html>
<body>
<h1>Hello, <?php echo $name; ?></h1>
</body>
</html>
The view may be returned to the browser like so:
Route::get('/', function () {
return view('greeting', ['name' => 'James']);
});
As you can see, the first argument passed to the view helper corresponds to the name of the view file in the resources/views directory. The second argument passed to helper is an array of data that should be made available to the view.
Of course, views may also be nested within sub-directories of the resources/views directory. For example, if your view is stored at resources/views/admin/profile.php, it should be returned like so:
return view('admin.profile', $data);
// Using conventional approach
$view = view('greeting')->with('name', 'Victoria');
// Using Magic Methods
$view = view('greeting')->withName('Victoria');
In the example above, the variable $name is made accessible to the view and contains Victoria.
If you wish, you may pass an array of data as the second parameter to the view helper:
$view = view('greetings', $data);
When passing information in this manner, $data should be an array with key/value pairs. Inside your view, you can then access each value using it's corresponding key, like {{ $key }} (assuming $data['$key'] exists).
Occasionally, you may need to share a piece of data with all views that are rendered by your application. You may do so using the share method:
view()->share('data', [1, 2, 3]);
Typically, you would place calls to the share method within a service provider's boot method. You are free to add them to the AppServiceProvider or generate a separate service provider to house them.
For example, here is what it looks like to call the share method from a service provider:
<?php namespace App\Providers;
class AppServiceProvider extends ServiceProvider
{
/**
* Bootstrap any application services.
*
* @return void
*/
public function boot()
{
view()->share('key', 'value');
}
/**
* Register the service provider.
*
* @return void
*/
public function register()
{
//
}
}
Note: When the
viewhelper is called without arguments, it returns an implementation of theIlluminate\Contracts\View\Factorycontract.
If you need to determine if a view exists, you may use the exists method:
if (view()->exists('emails.customer')) {
//
}
If you wish, you may generate a view from a fully-qualified file path:
return view()->file($pathToFile, $data);
View composers are callbacks or class methods that are called when a view is rendered. If you have data that you want to be bound to a view each time that view is rendered, a view composer organizes that logic into a single location.
Let's organize our view composers within a service provider. We'll use the view helper to access the underlying Illuminate\Contracts\View\Factory contract implementation:
<?php namespace App\Providers;
use Illuminate\Support\ServiceProvider;
class ComposerServiceProvider extends ServiceProvider
{
/**
* Register bindings in the container.
*
* @return void
*/
public function boot()
{
// Using class based composers...
view()->composer('profile', 'App\Http\ViewComposers\ProfileComposer');
// Using Closure based composers...
view()->composer('dashboard', function ($view) {
});
}
/**
* Register
*
* @return void
*/
public function register()
{
//
}
}
Note: Laravel does not include a default directory for view composers. You are free to organize them however you wish. For example, you could create an
App\Http\ViewComposersdirectory.
Remember, you will need to add the service provider to the providers array in the config/app.php configuration file.
Now that we have registered the composer, the ProfileComposer@compose method will be executed each time the profile view is being rendered. So, let's define the composer class:
<?php namespace App\Http\ViewComposers;
use Illuminate\Contracts\View\View;
use Illuminate\Users\Repository as UserRepository;
class ProfileComposer
{
/**
* The user repository implementation.
*
* @var UserRepository
*/
protected $users;
/**
* Create a new profile composer.
*
* @param UserRepository $users
* @return void
*/
public function __construct(UserRepository $users)
{
// Dependencies automatically resolved by service container...
$this->users = $users;
}
/**
* Bind data to the view.
*
* @param View $view
* @return void
*/
public function compose(View $view)
{
$view->with('count', $this->users->count());
}
}
Just before the view is rendered, the composer's compose method is called with the Illuminate\Contracts\View\View instance. You may use the with method to bind data to the view.
Note: All view composers are resolved via the service container, so you may type-hint any dependencies you need within a composer's constructor.
The composer method accepts the * character as a wildcard, so you may attach a composer to all views like so:
view()->composer('*', function ($view) {
//
});
You may also attach a view composer to multiple views at once:
view()->composer(
['profile', 'dashboard'],
'App\Http\ViewComposers\MyViewComposer'
);
You may use the composers method to register a group of composers at the same time:
view()->composers([
'App\Http\ViewComposers\AdminComposer' => ['admin.index', 'admin.profile'],
'App\Http\ViewComposers\UserComposer' => 'user',
'App\Http\ViewComposers\ProductComposer' => 'product'
]);
View creators work almost exactly like view composers; however, they are fired immediately when the view is instantiated. To register a view creator, use the creator method:
view()->creator('profile', 'App\Http\ViewCreators\ProfileCreator');
Blade is a simple, yet powerful templating engine provided with Laravel. The core benefits of Blade are template inheritance and sections. All Blade template files should use the .blade.php extension, and are typically stored in resources/views.
Let's take a look at a simple Blade templating example. First, we will examine a "master" template. Since most web applications maintain the same general layout across various pages, it's convenient to define this layout as a single Blade view.
<!-- Stored in resources/views/layouts/master.blade.php -->
<html>
<head>
<title>App Name - @yield('title')</title>
</head>
<body>
@section('sidebar')
This is the master sidebar.
@show
<div class="container">
@yield('content')
</div>
</body>
</html>
Once we have defined our template, we can use the Blade @extends directive to inject content into this template from a "child" page of our application.
@extends('layouts.master')
@section('title', 'Page Title')
@section('sidebar')
@@parent
<p>This is appended to the master sidebar.</p>
@stop
@section('content')
<p>This is my body content.</p>
@stop
Note that views which extend a Blade layout simply override sections from the layout. Content of the layout can be included in a child view using the @@parent directive in a section, allowing you to append to the contents of a layout section such as a sidebar or footer.
Sometimes, such as when you are not sure if a section has been defined, you may wish to pass a default value to the @yield directive. You may pass the default value as the second argument:
@yield('section', 'Default Content')
Hello, {{ $name }}.
The current UNIX timestamp is {{ time() }}.
Note: Blade
{{ }}statements are automatically send through PHP'shtmlentitiesfunction to prevent XSS attacks.
Sometimes you may wish to echo a variable, but you aren't sure if the variable has been set. Basically, you want to do this:
{{ isset($name) ? $name : 'Default' }}
However, instead of writing a ternary statement, Blade allows you to use the following convenient short-cut:
{{ $name or 'Default' }}
If you need to display a string that is wrapped in curly braces, you may escape the Blade behavior by prefixing your text with an @ symbol:
@{{ This will not be processed by Blade }}
If you don't want the data to be escaped, you may use the following syntax:
Hello, {!! $name !!}.
Note: Be very careful when echoing content that is supplied by users of your application. Always use the double curly brace syntax to escape any HTML entities in the content.
@if (count($records) === 1)
I have one record!
@elseif (count($records) > 1)
I have multiple records!
@else
I don't have any records!
@endif
@unless (Auth::check())
You are not signed in.
@endunless
@for ($i = 0; $i < 10; $i++)
The current value is {{ $i }}
@endfor
@foreach ($users as $user)
<p>This is user {{ $user->id }}</p>
@endforeach
@forelse ($users as $user)
<li>{{ $user->name }}</li>
@empty
<p>No users</p>
@endforelse
@while (true)
<p>I'm looping forever.</p>
@endwhile
@include('view.name')
You may also pass an array of data to the included view:
@include('view.name', ['some' => 'data'])
To overwrite a section entirely, you may use the overwrite statement:
@extends('list.item.container')
@section('list.item.content')
<p>This is an item of type {{ $item->type }}</p>
@overwrite
@lang('language.line')
@choice('language.line', 1)
{{-- This comment will not be in the rendered HTML --}}
The @inject directive may be used to retrieve a service from the Laravel service container. The first argument passed to @inject is the name of the variable the service will be placed into, while the second argument is the class / interface name of the service you wish to resolve:
@inject('metrics', 'App\Services\MetricsService')
<div>
Monthly Revenue: {{ $metrics->monthlyRevenue() }}.
</div>
Blade even allows you to define your own custom directives. You can use the directive method to register a directive. When the Blade compiler encounters the directive, it calls the provided callback with its parameter. This allows you to replace your directives with any logic as complex as you want.
The following example creates a @datetime($var) directive which formats a given $var:
Blade::directive('datetime', function($expression) {
return "<?php echo with{$expression}->format('m/d/Y H:i'); ?>";
});
The final PHP executed by this directive will be:
<?php echo with($var)->format('m/d/Y H:i'); ?>