Question

我面临一个需要帮助的小问题。我有这个php应用程序，它将数据传递到树枝html模板。

我的PHP代码生成以下内容（简化）：

$menuItemsWithPictures = array(
   'PageName' => "page_name",
   'pictures' => array('/path/to/picture1.jpg', '/path/to/picture2.jpg'),
);

在我的前端，我想将$menuItemsWithPictures中的每个项目渲染成这样的内容（同样，在这里非常简化）：

<div>
  <a href=PageName><!-- Taken from the PageName key in the array-->
     <img src=picture1 /> <!-- taken from pictures array [0] -->
     <img src=picture2 /> <!-- taken from pictures array [1] -->
  </a>
</div>

我尝试了{% for key, value in array %}的一些变体，但无济于事，因为我总是最终会a标签的生成与数组的长度一样长。

有人可以在这里向我指出正确的方向吗？

问候，derelektrischemoench

Answer 1

我认为您弄错了数组示例。我相信您实际上正在使用多维数组，不是吗？像这样：

$menuItemsWithPictures = [
    [
        'pageName' => 'page_name',
        'pictures' => array('/path/to/picture1.jpg', '/path/to/picture2.jpg'),
    ],
    [
        'pageName' => 'another_page',
        'pictures' => array('/path/to/picture1.jpg', '/path/to/picture2.jpg'),
    ]
];

如果是这种情况，那么Corret Twig的语法将是：

<div>
    {% for item in menuItemsWithPictures %}
        <a href="{{ item.pageName }}">
            {% for image in item.pictures %}
                <img src="{{ image }}"/>
            {% endfor }
        </a>
    {% endfor %}
</div>

Answer 2

您将需要一个嵌套循环来实现所需的功能，第一个循环将遍历页面，而内部循环将处理图片：

<div>
{% for page in pages %}
  <a href="#{{ page.PageName }}">
  {% for picture in page.pictures %}
     <img src={{ picture }} />
  {% endfor %}
</a>
{% endfor %}
</div>

以下是您的用例的树枝小提琴：https://twigfiddle.com/8ncmqi

用树枝渲染嵌套的关联数组

2 个答案: