javascript - 如何使用 symfony2 动态访问 twig 模板中的对象

Question

我什至不知道这个问题用什么标题。我从网络编程开始，我什至不知道应该使用什么技术来做到这一点。

我有一个包含 symfony2 Doctrine 的数据库。该数据库有画廊，每个画廊都有图像(两个表OneToMany关系)。

我将一组画廊传递给一个 Twig 模板，在其中选择显示它们，这样我就可以选择一个画廊并向画廊添加更多图像，添加新画廊或使用提交按钮删除它们。

现在可以使用此模板:

<select class="listGalleries" id="listGalleries" name='id' size="10">
{% for gallery in galleries %}
    <option value="{{gallery.id}}" >{{gallery.name}}</option>
{% endfor %}
</select>

它位于表单内。

现在，我想做的是每次单击选择的一项时，在同一网页中显示所选图库的所有图像。

我不知道应该使用哪种技术。我可以用 Twig 做吗？我必须学习ajax吗？我想我必须去数据库读取属于该画廊的图片的数据，但我不知道该怎么做，也不知道 symfony2 是否为我提供了更好的解决方案。

我们将不胜感激每一条建议。

Answer 1

“动态”无法在 twig 中完成，因为渲染后无法更改输出。

我认为你可以通过两种方式做到:

使用 twig 在画廊内循环并输出它们，然后使用一些像引导选项卡这样的 JavaScript 在更改选项时显示每个画廊。在 bootstrap 中你可以这样做(假设 gallery->images 关系位于 $gallery->images 中):

<div class="tab-content">
    {% for gallery in galleries %}
        <div class="tab-pane active" id="gallery{{ gallery.id }}">
             {% for image in gallery.images %}
                 <img src="{{ image.url }}" class="img-polaroid">
             {% endfor %}
        </div>
    {% endfor %}
</div>

现在使用像 javascript

$("select#listGalleries").change(function () {
    $("select option:selected").each(function () {
        $("#gallery" + $(this).attr('value')).tab('show');
    });
})

否则，您可以在从中选择图库后使用ajax返回图库图像，并将图库图像呈现在页面上的某个位置。这可以通过两种方式完成，在 symfony 中渲染 html，然后使用 javascript 将输出放置在页面中，或者仅返回一个 json (使用类似 this 的内容)并在 javascript 中创建 html (我个人使用很多 pure )。