I want to share with the community my small library, which adds control directives to the Blade Laravel-templating syntax.
Just a small example of how it looks:
<div bd-if="$entry->active" bd-class="$entry->active ? 'active'"> <ul> <li bd-foreach="$entry->items as $item">{{{ $item }}}</li> </ul> </div>
After exploring Angular.js, the familiar patterns began to seem illogical and inconvenient. I wanted to manage tags and attributes, and not to treat HTML as with a regular line. Blade Blade makes it easy to expand the functionality, which I used.
')
Installation
- Add the package "sleeping-owl / blade-extended" to your composer.json.
- Add a service provider to your “app / config / app.php” - 'SleepingOwl \ BladeExtended \ BladeExtendedServiceProvider'.
- Extended syntax is now available to you.
How it works
The library is trivially simple - all it does is convert attributes into the correct Blade syntax. So for example the code:
<span bd-if="test()"></span> <div bd-foreach="$items as $item"><div class="title">{{{ $item }}}</div></div>
will be reduced to:
@if(test())<span></span>@endif @foreach($items as $item)<div><div class="title">{{{ $item }}}</div></div>@endforeach
The situation with the tag attributes is somewhat more complicated - the helper is used here, which displays the attribute only if it contains a value.
Supported Directives
bd-foreach ,
bd-inner-foreachRepeats the entire tag (bd-foreach), or the entire contents of the tag (bd-inner-foreach) in accordance with the specified values.
bd-ifDisplays or not the tag depending on the condition.
bd-classAdds one or more classes to an element; you can use conditions. If the tag has a class attribute already defined, new classes will be added to it.
<div class="post" bd-class="$entry->active ? 'active', $entry->isInFuture() ? 'in-future' : 'in-past'"></div>
bd-attr- <attribute name>It works in the same way as bd-class, but does not support multiple values and additions to an existing attribute.
<div bd-attr-id="$entry->id" bd-attr-data-type="$entry->type"></div>
bd-yield ,
bd-includeThese directives add corresponding Blade commands to the tag body.
<div bd-yield="'content'"></div>
bd-sectionFrames the tag in the blade section.
<div bd-section="'content'"></div>
Want more syntax?
The functionality of my library, which extends Blade's capabilities, can also be extended. You can register your attributes to be processed:
BladeExtended::extend('bd-test', function (BladeExtended $bladeExtended, &$finded) { $bladeExtended->wrapOuterContent($finded, '@if(myCustomTest())', '@endif'); });
Sources on GitHub |
Documentation and examples