IronWoods.es

Desarrollo web

Blog / Laravel / Extender Blade con nuevas directivas

Se pueden añadir nuevas directivas a Blade para su uso en los templates permitiéndonos "limpiarlos", como inconveniente todo lo que reciben es un string, con independencia del dato de entrada.

Ejemplo con directivas Blade

Voy a usar directivas para mostrar IVA: 21% - 42,00 € en la página. Usaré, por ejemplo:


@iva(21) - @euro(42)

Creando directivas

Podemos añadir las directivas en el método boot() de un provider, ya sea en AppServiceProvider o creando uno nuevo ex profeso. Lo mejor será optar por la segunda opción.

Crear un service provider

php artisan make:provider BladeServiceProvider

Lo registramos en la configuración: "config/app.php", en el grupo de service providers.


'providers' => [
    ...
    App\Providers\EventServiceProvider::class,
    App\Providers\RouteServiceProvider::class,

    App\Providers\BladeServiceProvider::class,
],
Añadir las directivas

En el método boot() del nuevo provider introducimos:


Blade::directive('iva', function ($str) {
    return 'IVA: ' . $str . '%';
});

Blade::directive('euro', function ($str) {
    return $str . ' €';
});

Antes de la declaración de la clase, hay que cargar "Blade":


use Illuminate\Support\Facades\Blade;

Guardar todo.

Regenerar el autoload:

composer dump-autoload

Si las directivas ya están en el template, al recargar la página deberíamos ver lo esperado.

Creando directivas de "bloque"

Para mostrar bloques de código uso el HTML:


<pre>
<code class="code-box">
    ...
</code>
</pre>

o:


<code class="inline-code">
    ...
</code>

Voy a crear las directivas para que Blade añada este HTML por mí.

En el método boot() del service provider que cree en el ejemplo anterior, añadiré:


Blade::directive('code', function () {
    return '<pre><code class="code-box">';
});

Blade::directive('endcode', function () {
    return '</pre></code>';
});

Blade::directive('icode', function (string $str) {
    return '<code class="inline-code">' . $str . '</code>';
});

Guardo y regenero el autoload.

Desde ahora, para escribir bloques de código escribiré:


@code
    ...
@endcode

o bien:


@green(...)
Blade::directive('lang', function ($expression) { return "$expression"; }); Use it like this:

messages.welcome