Laravel Transclude
, (*1)
This package allow to use transclusion from Blade template engines.
It's very useful when you want to handle views as component. It's inspired by the Angular transclude logic., (*2)
Installing
, (*3)
This project can be installed using Composer. Add the following to your composer.json:, (*4)
{
"require": {
"chstudio/laravel-transclude": "~2.0"
}
}
or run this command:, (*5)
composer require chstudio/laravel-transclude
After updating composer, add the ServiceProvider to the providers array in config/app.php., (*6)
Laravel 5.5+
This library is compatible with the package auto-discovery feature so you have nothing to do...
If you prefer adding yourself your providers, please follow the official documentation guidelines., (*7)
Laravel <5.5:
Add this in the providers section of the config/app.php file :, (*8)
CHStudio\LaravelTransclude\TranscludeServiceProvider::class,
Then you can use the new blade directives in your views !, (*9)
Usage
This package register three new Blade directives :, (*10)
-
@transclude / @endtransclude to write inside a transcluded block,
-
@transcluded to declare a space where the transclusion will be written.
For example, take the Bootstrap form elements, they are all using the same global
structure. Then in that structure there are different html blocks depending on the form element., (*11)
Create template files
<div class="form-group">
<label for="{{ $name }}" class="control-label">{{$label}}</label>
@transcluded
</div>
radio.blade.php
@transclude('input-group')
@foreach($options as $option)
<div class="radio">
<label>
<input name="{{$name}}" type="radio" {{$option['value']==$selected?' checked':''}} value="{{$option['value']}}" />
{{$option['label']}}
</label>
</div>
@endforeach
@endtransclude
Use the new blocks
Then after writing this 3 files, you can add an element using the @include directive :, (*12)
<form>
@include('radio', [
'options' => [
['value' => '1', 'label' => 'Option 1']
],
'selected' => '1',
'label' => 'My radio button'
'name' => 'my-radio'
])
</form>
This code will generate a full radio element with a combination of input-group and radio templates :, (*13)
Contributing
We welcome everyone to contribute to this project. Below are some of the things that you can do to contribute., (*14)
Wallogit.com
