模板

Question

我是否有办法在Twig中创建一个易于维护的for循环，可以使用Bootstrap的布局？

我使用bootstrap的行功能，这意味着每一行都有一个div＆＃34; row＆＃34;。这使得事情变得棘手，因为我无法输入这些标题div。

例如，我的主页面将有几篇文章，并扩展骨架模板，如下所示。有什么方法可以使用这个骨架基础并在for循环中多次使用它吗？

我已尝试添加文章块，但它会覆盖内部的所有内容。我是否必须创建另一个模板才能使用？

<div id="main" class="container-fluid">
    {% block article %}
    <div class="row">
        <div class="col-md-3"></div>
        <div id="title" class="col-md-6">
            {% block title %}
            {% endblock title %}
        </div>
        <div class="col-md-3"></div>
    </div>
    <div class="row">
        <div class="col-md-1"></div>
        <div id="left-nav" class="col-md-2">
            {% block left_nav %}
            {% endblock left_nav %}
        </div>
        <div class="col-md-6" id="content">
            {% block content %}
            {% endblock content %}
        </div>
        <div id="right-nav" class="col-md-2">
            {% block right_nav %}
            {% endblock right_nav %}
        </div>
        <div class="col-md-1"></div>
    </div>
    {% endblock article %}
</div>

如何迭代和创建多个＆＃34;文章＆＃34;在这种情况下？

使用parent（）并不是很有用，因为它只是打印开始和结束标记，我需要将它们放在周围正确的部分，否则行赢了＆＃39; t work。

换句话说，在for循环上下文中，如何更改父块中子块内变量的值？

道歉，如果不清楚，我发现很难说出来。

编辑： 我知道twig中存在for循环，我只是不确定如何实现这个特定问题的解决方案。

作为骨架模板及其输出的简单示例：

模板

<div class="row">
  <div class="title">
    {% block title %}{% endblock %}
  </div>
  <div id="content">
    {% block content %}{% endblock %}
  </div>
</div>

输出

<div class="row">
  <div class="title">
    This is the first post.
  </div>
  <div id="content">
    Post 1
  </div>
</div>
<div class="row">
  <div class="title">
    This is the second post.
  </div>
  <div id="content">
    Post 2
  </div>
</div>

Answer 1

我找到了一个相当可维护的解决方案，因为它仍然扩展了骨架模板，但足够灵活，可以支持块内的循环。

骨架

<div id="main" class="container-fluid">
    {% block article %}
    <div class="row">
        <div class="col-md-3"></div>
        <div id="whitespace" class="col-md-6">
            {% block title %}
            {% endblock title %}
        </div>
        <div class="col-md-3"></div>
    </div>
    <div class="row">
        <div class="col-md-1"></div>
        <div id="left-nav" class="col-md-2">
            {% block left_nav %}
            {% endblock left_nav %}
        </div>
        <div class="col-md-6" id="content">
            {% block content %}
            {% endblock content %}
        </div>
        <div id="right-nav" class="col-md-2">
            {% block right_nav %}
            {% endblock right_nav %}
        </div>
        <div class="col-md-1"></div>
    </div>
    {% endblock article %}
</div>

文章列表

{% extends 'skeleton.php' %}
    {% block article %}
        {% for post in posts %}
        <div class="row">
            {# Start title #}
            <div class="col-md-3"></div>
            <div id="title" class="col-md-6">
                {{post.title}}
            </div>
            <div class="col-md-3"></div>
            {# End title #}
        </div>
        <div class="row">
            <div class="col-md-1"></div>
            {# Start left-nav #}
            <div id="left-nav" class="col-md-2">
                {{post.left}}
            </div>
            {# end left-nav #}

            {# Start content #}
            <div class="col-md-6" id="content">
                {{post.getBody}}
            </div>
            {# end content #}

            {# start right-nav #}
            <div id="right-nav" class="col-md-2">
                {{post.right}}
            </div>
            {# end right-nav #}
            <div class="col-md-1"></div>
        </div>
        {% endfor %}
    {% endblock article %}

Answer 2

{% foreach article in articles %}
<div class="row">
  <div class="title">
    {{ article.title }}
  </div>
  <div id="content">
    {{ article.content }}
  </div>
</div>
{% endfor %}

模板假设文章是一个包含键标题和内容

的数组的数组

在for循环中使用父块和子块，包括变量

模板

输出

2 个答案:

骨架

文章列表