[英]Include a view with a variable inside another view (Laravel's 5.6 - Blade)
[英]is it possible to include a dynamic blade view in another blade view?
我传统上知道我们在刀片视图中包含文件,例如@include('file.path.etc')或@extends('file.path.etc'),但是在这里,我尝试包含动态视图(其中包含包含来自数据库)用作我的静态欢迎页面视图(这是在创建项目时建立的默认视图)中的一部分。 当我尝试包含它时,由于无法包含在默认的welcome.blade.php中的变量,它给了我错误,这是我得到错误图片的一个错误尝试,其中包含文件并产生了该部分在里面。 这是我尝试包含的代码
<section class="section swatch-red-white">
<div class="container">
@if($continents)
<header class="section-header underline">
<h1 class="headline hyper hairline">Meet the team</h1>
<p class="">Your bones don't break, mine do. That's clear. Your cells react to bacteria and viruses differently than mine. You don't get sick, I do. That's also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke.</p>
</header>
<div class="row">
<ul class="list-unstyled row box-list">
@foreach($continents as $continent)
<li class="col-md-4 os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".0s">
<div class="box-hex flat-shadow box-huge">
<div class="box-dummy"></div>
<figure class="box-inner">
<img class="svg-inject" src="{{$continent->photo ? asset($continent->photo->file) : asset('images/404.png')}}" alt="a man with a mustache">
<figcaption class="box-caption">
<h4>Likes</h4>
<p>Coffee and Beer</p>
</figcaption>
</figure>
</div>
<h3 class="text-center">
<a href="#">{{$continent->name}}</a>
</h3>
<ul class="list-inline text-center social-icons social-simple">
<li>
<a href="#" target="_self"><i class="fa fa-facebook"></i></a>
</li>
<li>
<a href="#" target="_self"><i class="fa fa-twitter"></i></a>
</li>
</ul>
</li>
@endforeach
</ul>
</div>
@endif
</div>
</section>
这是控制器的代码
public function index()
{
$continents = Continent::all();
return view('admin.continent.continent',compact('continents'));
}
这是welcome.blade.php的一部分,我正在其中尝试调用数据表单。
<div id="content" role="main">
<section class="section swatch-red-white">
<div class="background-media" style="background-image: url({{asset('images/design/section-bg/bg-2.jpg')}}); background-repeat: ; background-size: ; background-attachment: ; background-position: ; background-size: cover" data-start="background-position: 50% 0px" data-top-bottom="background-position: 50% -200px"></div>
<div class="background-overlay" style="background-color:rgba(231,76,60,0.8)"></div>
<div class="container">
<header class="section-header underline">
<h1 class="headline hyper hairline">Welcome to One58 Travel & Tour</h1>
<p class="big">We make your dream vacations come true</p>
</header>
</div>
</section>
<section class="section swatch-white-red has-top">
<div class="decor-top">
<svg class="decor" height="100%" preserveaspectratio="none" version="1.1" viewbox="0 0 100 100" width="100%" xmlns="http://www.w3.org/2000/svg">
<path d="M0 0 L100 100 L0 100" stroke-width="0"></path>
</svg></div><div class="container">
<header class="section-header underline">
<h1 class="headline super hairline">Features</h1>
<p class="">Angle is a uniquely designed wordpress theme. It's super easy to modify and uses advanced CSS techniques built on the latest Bootstrap Framework.</p>
</header>
<div class="row">
<ul class="list-unstyled row box-list">
<li class="col-md-3 text-center os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".0s">
<div class="box-round">
<div class="box-dummy">
</div>
<a class="box-inner" href="#">
<img class="svg-inject" src="{{asset('images/design/custom-icons/custom-icon-composer.png')}}" alt="a clock" data-animation="">
</a>
</div>
<h3 class="text-center">
<a href="#">Retina ready</a>
</h3>
<p class="text-center">Angle is build to look sharp ,cool and awesome on all displays. Images will look sharp and clear.</p>
</li>
<li class="col-md-3 text-center os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".3s">
<div class="box-round">
<div class="box-dummy">
</div>
<a class="box-inner" href="#">
<img class="svg-inject" src="{{asset('images/design/custom-icons/custom-icon-bag.png')}}" alt="a clock" data-animation="">
</a>
</div>
<h3 class="text-center">
<a href="#">Free updates</a>
</h3>
<p class="text-center">No need to worry on keeping your theme updated. With Angle you get free updates for life.</p>
</li>
<li class="col-md-3 text-center os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".6s">
<div class="box-round">
<div class="box-dummy">
</div>
<a class="box-inner" href="#">
<img class="svg-inject" src="{{asset('images/design/custom-icons/custom-icon-iphone-white.png')}}" alt="a clock" data-animation="">
</a>
</div>
<h3 class="text-center">
<a href="#">Responsive Design</a>
</h3>
<p class="text-center">We have designed this site mobile first so it looks great on mobile devices of all sizes.</p>
</li>
<li class="col-md-3 text-center os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".9s">
<div class="box-round">
<div class="box-dummy">
</div>
<a class="box-inner" href="#">
<img class="svg-inject" src="{{asset('images/design/custom-icons/custom-icon-clipboard.png')}}" alt="a clock" data-animation="">
</a>
</div>
<h3 class="text-center">
<a href="#">100% support</a>
</h3>
<p class="text-center">With Angle as with all our themes you will receive our 100% rock solid support.</p>
</li>
</ul>
</div>
</div>
</section>
{{--@include('admin.continent.continent')--}}
{{--@section('continent')--}}
{{--{{View::make('continents')->with('continents', $continents)}}--}}
{{--@endsection--}}
<section class="section swatch-white-red has-top">
<div class="decor-top">
<svg class="decor" height="100%" preserveaspectratio="none" version="1.1" viewbox="0 0 100 100" width="100%" xmlns="http://www.w3.org/2000/svg">
<path d="M0 0 L100 100 L0 100" stroke-width="0"></path>
</svg>
</div>
<div class="container">
<header class="section-header underline">
<h1 class="headline super hairline">Meet the team</h1>
</header>
<div class="row">
<ul class="list-unstyled row box-list">
<li class="col-md-4 os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".0s">
<div class="box-round flat-shadow box-big">
<div class="box-dummy">
</div>
<figure class="box-inner">
<img class="svg-inject" src="{{asset('images/design/people/man-1-800x800.png')}}" alt="a clock">
<figcaption class="box-caption">
<h4>Likes</h4>
<p>Coffee and Beer</p>
</figcaption>
</figure>
</div>
<h3 class="text-center">
<a href="#">John Langan</a>
<small class="block">Art Director</small>
</h3>
<p class="text-center">Your bones don’t break, mine do. That’s clear. Your cells react to bacteria and viruses differently than mine. You don’t get sick, I do. That’s also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke.</p>
<ul class="list-inline text-center social-icons social-simple">
<li>
<a href="#" target="_self">
<i class="fa fa-facebook"></i>
</a>
</li>
<li>
<a href="#" target="_self">
<i class="fa fa-twitter"></i>
</a>
</li>
</ul>
</li>
<li class="col-md-4 text-center os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".3s">
<div class="box-round flat-shadow box-big">
<div class="box-dummy"></div>
<figure class="box-inner">
<img class="svg-inject" src="{{asset('images/design/people/woman-1-800x800.png')}}" alt="a clock">
<figcaption class="box-caption">
<h4>Says</h4>
<p>I like ancient stuff</p>
</figcaption>
</figure>
</div>
<h3 class="text-center">
<a href="#">Kate Ross</a>
<small class="block">Creative Director</small>
</h3>
<p class="text-center">Your bones don’t break, mine do. That’s clear. Your cells react to bacteria and viruses differently than mine. You don’t get sick, I do. That’s also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke.</p>
<ul class="list-inline text-center social-icons social-simple">
<li>
<a href="#" target="_self">
<i class="fa fa-pinterest"></i>
</a>
</li>
<li>
<a href="#" target="_self">
<i class="fa fa-instagram"></i>
</a>
</li>
</ul>
</li>
<li class="col-md-4 text-center os-animation" data-os-animation="fadeInUp" data-os-animation-delay=".6s">
<div class="box-round flat-shadow box-big">
<div class="box-dummy"></div>
<figure class="box-inner">
<img class="svg-inject" src="{{asset('images/design/people/man-2-800x800.png')}}" alt="a clock">
<figcaption class="box-caption">
<h4>Moto</h4>
<p>Live and let die</p>
</figcaption>
</figure>
</div>
<h3 class="text-center">
<a href="#">Manos Jones</a>
<small class="block">IOS Developer</small>
</h3>
<p class="text-center">Your bones don’t break, mine do. That’s clear. Your cells react to bacteria and viruses differently than mine. You don’t get sick, I do. That’s also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke.</p>
<ul class="list-inline text-center social-icons social-simple">
<li>
<a href="#" target="_self">
<i class="fa fa-facebook-square"></i>
</a>
</li>
<li>
<a href="#" target="_self">
<i class="fa fa-dribbble"></i>
</a>
</li>
<li>
<a href="#" target="_self">
<i class="fa fa-google-plus-square"></i>
</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</section>
<section class="section swatch-red-white has-top">
<div class="decor-top">
<svg class="decor" height="100%" preserveaspectratio="none" version="1.1" viewbox="0 0 100 100" width="100%" xmlns="http://www.w3.org/2000/svg">
<path d="M0 100 L100 0 L100 100" stroke-width="0">
</path>
</svg>
</div>
<div class="container">
<div class="row">
<div id="slider-flex3" class="flexslider text-left" data-flex-speed="7000" data-flex-animation="slide" data-flex-controls="hide" data-flex-directions="show" data-flex-controlsalign="center" data-flex-captionhorizontal="alternate" data-flex-captionvertical="bottom" data-flex-controlsposition="" data-flex-directions-type="">
<ul class="slides">
<li>
<figure>
<img style="height: 150px; width:150px " src="{{asset('images/design/vector/slide-1.png')}}" alt="some image">
<figcaption>
<h3>Colorful and clean</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae, iure voluptatem dolore pariatur deleniti nihil cupiditate vel sunt consectetur.</p>
</figcaption>
</figure></li>
<li>
</ul>
</div>
</div>
</div>
</section>
<section class="section swatch-red-white has-top">
这是大陆模型
<?php
namespace App;
use Illuminate\Database\Eloquent\Model;
class Continent extends Model
{
protected $fillable = [
'name','photo_id',
];
public function tour(){
return $this->belongsTo('App\Tour');
}
public function photo(){
return $this->belongsTo('App\Photo');
}
}
无论您在哪里生成大洲列表,都请执行此行代码。
View::make('continents')->with('continents', $continents);
您应该将大洲作为参数传递给包含的视图
@include('admin.continent.continent', ['continents'=>$continents])
您可以通过三种方式与视图共享数据:
传递数据数组以查看:
return view('greetings', ['name' => 'Victoria']);
或者,使用with
方法:
return view('greeting')->with('name', 'Victoria');
有时,您可能需要与应用程序呈现的所有视图共享一条数据。 您可以使用视图外观的share方法来实现。 通常,您应该在服务提供商的启动方法中发出要共享的调用。 您可以自由地将它们添加到AppServiceProvider或生成单独的服务提供商来容纳它们。
<?php
namespace App\Providers;
use Illuminate\Support\Facades\View;
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()
{
//
}
}
如果每次渲染视图时都有要绑定到视图的数据,则视图编辑器可以帮助您将逻辑组织到一个位置。
您还可以通过将视图数组作为第一个参数传递给composer方法,将视图组成器一次附加到多个视图。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.