Laravel 5.4.6 中的动态引导选项卡
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/42882548/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dynamic Bootstrap Tabs In Laravel 5.4.6
提问by Muhammad Amir
I have a problem with dealing with tabs, i need to render dynamic data from database on tabs 
我在处理选项卡时遇到问题，我需要在选项卡上呈现数据库中的动态数据
Here is code :
这是代码：
<div class="tab-v1">
<ul class="nav nav-tabs">
<?php
$categories = \App\ProjectCategory::all();
$projects = \App\ProjectCompleted::all();
$project = \App\ProjectCompleted
::orderBy('title', 'desc')->first();
?>
@foreach($categories as $cat)
<li><a href="#{{$cat->name}}" data-toggle="tab">{{$cat->name}}</a></li>
@endforeach
</ul>
<div class="tab-content">
<div class="tab-pane fade in active" id="home">
<div class="row">
<div class="col-sm-3">
<ul class="nav nav-pills nav-stacked">
<!--<li class="active"><a href="#resi-project1" data-toggle="tab"><i class="fa fa-angle-right"></i> Residencial Project Name</a></li>-->
@foreach($projects as $p)
<li><a href="#resi-project2" data-toggle="tab"><i class="fa fa-angle-right"></i>{{$p->title}}</a></li>
@endforeach
</ul>
</div>
<div class="col-sm-9">
<div class="tab-content">
<div class="tab-pane fade in active" id="resi-project1">
<h2>{{$project->title}}</h2>
<div id="myCarousel" class="carousel slide carousel-v1">
<div class="carousel-inner">
<?php
$images = \App\ProjectCompletedImage
::where('project_completed_id', $project->id)->get();
?>
@foreach($images as $img)
<div class="item active">
<img src="{{asset('images/projects-completed-images/'.$img->image)}}" alt="">
</div>
@endforeach
</div>
<div class="carousel-arrow">
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<i class="fa fa-angle-left"></i>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<i class="fa fa-angle-right"></i>
</a>
</div>
</div>
</div>
</div>
<p>{!!$project->details!!}</p>
</div>
</div>
</div>
</div>
</div>
Actually on these tabs , data is from category table and on clicking the tab it will show related data. Please guide me how to do that.
实际上在这些选项卡上，数据来自类别表，单击选项卡将显示相关数据。请指导我如何做到这一点。
Problem image
问题图片
回答by webpic
Try This
尝试这个
<div class="tab-v1">
<ul class="nav nav-tabs">
@foreach($categories as $cat)
<li><a href="#{{$cat->name}}" data-toggle="tab">{{$cat->name}}</a></li>
@endforeach
</ul>
<div class="tab-content">
@foreach($categories as $cat)
<div class="tab-pane fade in active" id="#<?php $cat->name ?>">
<div class="row">
<div class="col-sm-3">
// <p>Some content.</p>
</div>
</div>
</div>
@endforeach
</div>
</div>
Note:
注意：
<?php
$categories = \App\ProjectCategory::all();
$projects = \App\ProjectCompleted::all();
$project = \App\ProjectCompleted
::orderBy('title', 'desc')->first();
?>
code which you have written for queries in views should not be written here it should be written in model not in views .
您为视图中的查询编写的代码不应该写在这里，它应该写在模型中而不是在视图中。
