“使用t-foreach循环”的版本间的差异

2018年5月8日 (二) 17:44的最新版本

通过循环可以重复一个HTML块。我们可以用它将任务跟进者的图像添加到任务看板卡中。

让我们先渲染任务的合作伙伴ID：

<t t-foreach="record.message_partner_ids.raw_value" t-as="rec">
<t t-esc="rec" />; </t>

t-foreach指令接受一个JavaScript表达式，计算一个重复的集合。多数情况下，这将只是一个多对关系字段的名称。它是用一个t-as指令来设定在循环中用到的每项的名字.

下一条使用的t-esc指令根据所所提供的表达式进行计算，本例中只是rec变量，并将在HTML转码时加以渲染。

在前面的例子中，我们按照任务的跟进者来进行循环，并存储在message_parter_ids字段。因为看板卡片上有限的空间，我们可以使用JavaScript函数slice()来限定显示的跟进者的数量，如下所示：

t-foreach="record.message_partner_ids.raw_value.slice(0, 3)"

rec变量保存每次循环的值，本例中是合作伙伴ID。有了这个，我们可以重写跟随者的循环如下：

<t t-foreach="record.message_partner_ids.raw_value.slice(0, 3)"   t-as="rec">
<img t-att-src="kanban_image('res.partner', 'image_small', rec)" 
    class="oe_avatar" width="24" height="24" /></t>

例如，这可以在右页脚添加下一位负责用户的图像。

一些辅助变量也可用，变量名被冠以t-as变量所定义的前缀。本例中，我们使用rec，所以可用的辅助变量如下：

rec_index是0开始的循环索引

rec_size 集合的元素数量

rec_first 循环的第一个元素为真

rec_even 偶数索引为真

rec_odd奇数索引为真

rec_parity奇数或偶数,根据当前代表被遍历对象rec_all的索引

rec_value当遍历一个字典时，{键：值}，保存值（rec保存键值）

例如，我们可以使用以下来避免在我们的ID列表中的逗号：

<t t-foreach="record.message_parter_ids.raw_value.slice(0, 3)"   t-as="rec">
<t t-esc="rec" />
<t t-if="!rec_last">;</t>
</t>

上一节：使用t-att作为动态属性 下一节：使用t-if进行条件渲染