我在我的索引页呈现从我的数据库类别列表,我不知道如何给每个类别一个独特的风格,很容易给所有类别一个独特的风格,但如何个性化的风格,每一个。
每个类别都在一个网格块中呈现,每个网格块都有自己的样式。
现在的情况是,每个类别都是由数据库中的类别数量重复的。
这是我的小树枝文件:
{% for entity in entities %}
<div class="global-wrap">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="row row-wrap">
<div class="col-xs-12 col-md-8">
<div class="thumb">
<a class="hover-img" href="{{ path('categorieProducts', { 'entity' : entity.id }) }}">
<img height="357px" width="100%" src="{{ asset('bundles/flyplatform/img/blog1.jpg')}}" alt="Image Alternative text" title="" />
<div class="hover-inner hover-inner-block hover-inner-bottom hover-inner-bg-black hover-hold">
<div class="text-small">
<h5 style="font-family: Lato, sans-serif; text-align: center;font-size: 34px;font-weight: 500">{{ entity.name }}</h5>
<h6 style="text-align: right;font-family: Lato, sans-serif;font-size: 20px;font-weight: 400">77497 reviews</h6>
</div>
</div>
</a>
</div>
</div>
<div class="col-xs-6 col-md-4">
<div class="thumb">
<a class="hover-img" href="{{ path('categorieProducts', { 'entity' : entity.id }) }}">
<img height="357px" width="100%" src="{{ asset('bundles/flyplatform/img/blog1.jpg')}}" alt="Image Alternative text" title="" />
<div class="hover-inner hover-inner-block hover-inner-bottom hover-inner-bg-black hover-hold">
<div class="text-small">
<h5>{{ entity.name }}</h5>
<h6>54531 reviews</h6>
</div>
</div>
</a>
</div>
</div>
<div class="col-xs-6 col-md-4">
<div class="thumb">
<a class="hover-img" href="{{ path('categorieProducts', { 'entity' : entity.id }) }}">
<img height="357px" width="100%" src="{{ asset('bundles/flyplatform/img/blog1.jpg')}}" alt="Image Alternative text" title="" />
<div class="hover-inner hover-inner-block hover-inner-bottom hover-inner-bg-black hover-hold">
<div class="text-small">
<h5>{{ entity.name }}</h5>
<h6>68703 reviews</h6>
</div>
</div>
</a>
</div>
</div>
<div class="col-xs-12 col-md-8">
<div class="thumb">
<a class="hover-img" href="{{ path('categorieProducts', { 'entity' : entity.id }) }}">
<img height="357px" width="100%" src="{{ asset('bundles/flyplatform/img/grid1.png')}}" alt="Image Alternative text" title="" />
<div class="hover-inner hover-inner-block hover-inner-bottom hover-inner-bg-black hover-hold">
<div class="text-small">
<h5 style="font-family: Lato, sans-serif; text-align: center;font-size: 34px;font-weight: 500">{{ entity.name }}</h5>
<p style="text-align: right;font-family: Lato, sans-serif;font-size: 20px;font-weight: 400">44391 reviews</p>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
.
public function categorycityAction()
{
$em = $this->getDoctrine()->getManager();
$entities = $em->getRepository('FLYBookingsBundle:Categories')->findAll();
return $this->render('FLYBookingsBundle:Post:categorycity.html.twig', array('entities' => $entities));
}
添加:
@zizoujab的答案给了我一个想法,在页面索引中分别呈现每个类别,每个类别都有自己的控制器动作,然后对于每个控制器动作,我可以创建一个查询生成器,将搜索数据库的类别id。
但是我有以下错误:
在呈现模板期间抛出异常("控制器"飞行控制器' xxxxxxxBundle ' '为PostController: categorylondonAction ()要求您为"$entity"参数提供一个值(因为没有默认值或因为有一个非可选参数在这个之后)")
index.html.twig
{% render (controller('FLYBookingsBundle:Post:categorylondon')) %}
PostRepository.php
伦敦目录有数据库中的id 1
。
public function byLondon($entity)
{
$qb = $this->createQueryBuilder('u')
->select('u')
->Where('u.id = 1')
->orderBy('u.id')
->setParameter('entity', $entity);
return $qb->getQuery()->getResult();
}
.
PostController.php
public function categorylondonAction($entity)
{
$em = $this->getDoctrine()->getManager();
$entities = $em->getRepository('FLYBookingsBundle:Categories')->byLondon($entity);
return $this->render('FLYBookingsBundle:Post:categorylondon.html.twig', array('entities' => $entities));
}
首先出于可读性的考虑,你可以在一个单独的.html.twig
文件中编写单个类别的模板(所有的html代码在for循环中),我们称它为category_item.html.twig
。
你的代码现在看起来像这样:
{% for entity in entities %}
{% include 'path_to_category_item.html.twig' %}
{% endfor %}
对于独特的样式,我想不出一种方法可以为每个类别提供自定义样式,特别是如果类别计数是动态的。
因此,要么为样式提供随机值,要么将样式存储在每个类别中。就像这样,您将像这样传递每个类别的样式:
{% for entity in entities %}
{% include 'path_to_category_item.html.twig' with {'style': entity.style} %}
{% endfor %}
我将在Category实体中创建一个新属性,用于存储css类。然后,在循环中使用这个属性,并在CSS文件中配置这些CSS类。
实体:class Category
{
private $cssClass;
}
视图:
{% for entity in entities %}
[...]
<div class="category-container {{entity.cssClass }}">
[...]
</div>
[...]
{% endfor %}
CSS文件:
.category-container {
// here the global css properties common to all the categories
}
.category-01 {
// here the css properties unique to this category
[...]
}
我终于解决了我的问题。
这是我如何渲染我的控制器在index.html.twig:
{% render (controller('FLYBookingsBundle:Post:categorylondon' , { 'id': 1 })) %}
控制器:
public function categorylondonAction($id)
{
$em = $this->getDoctrine()->getManager();
$entities = $em->getRepository('FLYBookingsBundle:Categories')->findBy(array('id' => $id));
return $this->render('FLYBookingsBundle:Post:categorylondon.html.twig', array('entities' => $entities));
}
感谢@VaN和@zizoujab的帮助。