Movatterモバイル変換


[0]ホーム

URL:


Skip to content
DEV Community
Log in Create account

DEV Community

Cover image for Create Custom Blade Directives in Laravel
Koussay
Koussay

Posted on • Edited on

     

Create Custom Blade Directives in Laravel

Laravel Blade is awesome, really awesome. One of the greatest things about it, is the ability to add custom directives.
One use case I recently stumbled upon, is formatting money, with the currency. For sure I can create a helper function and call it.
Example

if(!function_exists('formatMoney')){functionformatMoney(string|int|float$amount){if(is_string($amount)){$amount=floatval($amount);}$settings=app(GeneralSettings::class);$formatter=newNumberFormatter(config('app.currency_locale','en_US'),NumberFormatter::CURRENCY);return$formatter->formatCurrency($amount,$settings->app_currency);}
Enter fullscreen modeExit fullscreen mode

And then we could use it in our views like the following

...{{ formatMoney($invoice->total) }}...
Enter fullscreen modeExit fullscreen mode

And we're good to go, but in this context, let's use the power of Blade and create our own directive.
In order to do so, openAppServiceProvider.php and head to theboot method.
Inside the boot method, we will write our own custom directive.

Blade::directive($name,function($expression){somecodehere;});
Enter fullscreen modeExit fullscreen mode

In our context we will use the code above, defined in a helper class, so we can format the money.
The blade directive will be namedmoney

Blade::directive('money',function($expression){return"<?php echo app('App\Utils\Helpers')->formatMoney($expression); ?>";});
Enter fullscreen modeExit fullscreen mode

So here is the final code, and in the view file, we can call it as follows

@money('somevalue')
Enter fullscreen modeExit fullscreen mode

The take here is in the return value, if you want to have some formatters, or some conditions, the return must be a PHP code. Let's take another example.
Laravel has@auth &@guest directives.
But let's make some thing on our own. Let's say we have customers in our application, so we will make a blade directive that checks if the authenticated user is a customer or not, and show some code based on that condition.
Usually, here is what we would do :

@if(auth()->user()->isCustomer)//some code here@endif
Enter fullscreen modeExit fullscreen mode

But, that would be hard if we have that piece of code everywhere in our views. Imagine if we will add another condition, like checks if the customer has an active subscription for example.
So yeah, you've got the point.
In this situation, we could leverage blade custom directives.
The use of the new directive would be as follows :

@customer//somecode here@endcustomer
Enter fullscreen modeExit fullscreen mode

As you can see here, we have two directives, so we will define two functions in ourAppServiceProvider.php

Blade::directive('customer',function($expression){return"<?php if(auth()->check() && auth()->user()->isCustomer): ?>";});Blade::directive('endcustomer',function($expression){return"<?php endif; ?>";});
Enter fullscreen modeExit fullscreen mode

The first one is to test the condition and open the colon for your code logic, and the other one, will close the the if statement.

In this short tutorial, we saw how we could write custom blade directives. I hope it was insightful for you to understand how to create and use them.
If there is any question or any suggestion, feel free to reach me onTwitter

Original Post

Top comments(0)

Subscribe
pic
Create template

Templates let you quickly answer FAQs or store snippets for re-use.

Dismiss

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment'spermalink.

For further actions, you may consider blocking this person and/orreporting abuse

I'm not an Expert , I'm just writing about the real-world examples I encounter.
  • Location
    Tunisia
  • Work
    Web Developer at Prettify
  • Joined

More fromKoussay

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

Log in Create account

[8]ページ先頭

©2009-2025 Movatter.jp