有没有办法用 TYPO3 液体包裹 X 件物品?

Is there a way to wrap X items in TYPO3 fluid?

使用扩展 DCE 元素,我创建了一个流体模板,为创建的每个项目生成一个 li 项目。现在我想让每个第一到第二个项目都有一个包装器。这样:

<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
<li>item 5</li>

变为:

<ul>
    <li>item 1</li>
    <li>item 2</li>
</ul>
<ul>
    <li>item 3</li>
    <li>item 4</li>
</ul>
<ul>
    <li>item 5</li>
</ul>

这在流体模板中可行吗?也许与 Typoscript 结合使用?

当然,除了 counters/iterators 之外,您还需要 for viewhelper。您可以使用 if viewhelper 来检查您的情况。 API 有一些例子:http://api.typo3.org/typo3cms/current/html/class_t_y_p_o3_1_1_c_m_s_1_1_fluid_1_1_view_helpers_1_1_for_view_helper.html#details

https://docs.typo3.org/typo3cms/ExtbaseGuide/Fluid/ViewHelper/For.html

如果您使用的是 VHS 视图助手集合扩展,那么您还可以使用 Iterator\Chunked 视图助手:

<v:iterator.chunk count="4" subject="{menu}" as="entries">
     <f:for each="{entries}" as="row">
          <f:for each="{row}" as="page">
          [...]
          </f:for>
     </f:for>
</v:iterator>

使用 for 视图助手的迭代器,这对于常规 Fluid 是可能的。

<f:for each="{items}" as="item" iteration="itemIterator">
    <f:if condition="{itemIterator.isOdd}">
        <ul>
    </f:if>
    <li>{item.name}</li>
    <f:if condition="{itemIterator.isOdd}">
        <f:then>
            <f:if condition="{itemIterator.isLast}">
                </ul>
            </f:if>
        </f:then>
        <f:else>
            </ul>
        </f:else>
    </f:if>
</f:for> 

棘手的部分是关闭 </ul>,它被上面的 Fluid 覆盖。

解决方案

这就是我最终使用 {cycle} 每 2 个项目迭代一次,然后关闭和打开标签的结果。以及确保最后一项不以开始标记结尾:

<ul>
    <f:for each="{field.item}" as="item" iteration="iterator">

        <f:if condition="{iterator.cycle} % 2">
            <f:then>
                <li>item {iterator.cycle}</li>
            </f:then>
            <f:else>
                <li>item {iterator.cycle}</li>
                <f:if condition="{iterator.isLast} != 1">
                    <f:then>
                        </ul><ul>
                    </f:then>
                </f:if>
            </f:else>
        </f:if>

    </f:for>
</ul>

备注

我知道借助 VHS 的强大功能 v:iterator.chunk 可能会用更少的代码解决这个问题,但我无法让它按我想要的方式工作。 如果有人愿意提供一个工作示例来比较这两个选项,我将不胜感激。

带 VHS

更新:21.12.2017

因此重新访问了块选项,使用 VHS iterator.chunk 的以下代码片段实现了相同的代码:

<f:for each="{field.item -> v:iterator.chunk(count: 2)}" as="col" iteration="cycle">
    <ul>
        <f:for each="{col}" as="item">
            <li>
                test
            </li>
        </f:for>
    </ul>
</f:for>                

也许这对外面的人有帮助!

我还有一个解决方案,至于我 - 更原生

<f:for each="{items}" as="item" iteration="itemIterator">
    <f:cycle values="{0:'left', 1:'right', 3:'center'}" as="order">
            <f:switch expression="{order}">
                <f:case value="left">
                       <div class="left">Conetnt</div>
                </f:case>
                <f:case value="right">
                       <div class="right">Conetnt</div>
                </f:case>
                <f:case value="center">
                       <div class="center">Conetnt</div>
                </f:case> 
            </f:switch>  
    </f:cycle> 
</f:for>