如何使用 TALES 在 tal:attributes 中为同一属性设置多个值

Question

我正在尝试在一个元素上设置多个 css 类。

不幸的是，这不起作用，因为它返回： LanguageError: Duplicate attribute name in attribute.

<ul>
    <li tal:repeat="item mainnav"
        tal:attributes="class 'first' if repeat.item.start else nothing; 
                        class 'last' if repeat.item.end else nothing;
                        class 'active' if item.active else nothing">
        <a tal:attributes="href item.href" tal:content="item.title">title</a>
    </li>
</ul>

将这 3 种情况合并到一个表达式中会使事情变得非常复杂，因为有 6 种不同的 CSS 状态 em>：

• 第一个+活动
• 第一个
• 最后一个+活动
• 最后一个
• 活动
• （无）

我能想到有2种可能的解决方案：

- >内联检查每个组合：

<ul>
    <li tal:repeat="item mainnav" 
        tal:attributes="
            class 'first active' if (repeat.item.start and item.active) else
                  'first'        if repeat.item.start else
                  'last active'  if (repeat.item.end and item.active) else
                  'last'         if repeat.item.end else
                  'active'       if item.active else nothing">
        <a tal:attributes="href item.href" tal:content="item.title">title</a>
    </li>
</ul>

->创建一个返回组合CSS类的方法

现在，是否有更好的方法，如果没有，这两种方法中哪一种更好（可能是后一种，就好像它变得更加复杂，内联脚本将变得不可读/无法管理）。

顺便说一句，是否有关于 Chameleon、TALES 的任何好的资源和示例（除了 http://chameleon.repoze.org/docs/latest)

Answer 1

您可以多次使用 tal:define 来定义类字符串的各个部分，然后从这些部分构造实际的属性：

<tal:loop repeat="item mainnav">
    <li tal:define="class_first  'first'  if repeat.item.start else '';
                    class_last   'last'   if repeat.item.end else '';
                    class_active 'active' if item.active else '';"
        tal:attributes="class string:$class_first $class_last $class_active">
       <a tal:attributes="href item.href" tal:content="item.title">title</a>
    </li>
</tal>

这可能会导致空的类属性，这是无害的。

至于附加文件； Chameleon 是 TAL 的实现，最初是为 Zope 页面模板开发的。因此，您会发现后者的很多文档也适用于 Chameleon，只要您考虑到 Chameleon 的默认 TALES 模式是 python:，而 ZPT 默认为 path ： 相反。例如，Zope Book 的高级页面模板章节也适用于 Chameleon 。

Answer 2

在变色龙中你可以这样做：

<ul>
    <li tal:repeat="item mainnav"
        class="${'first' if repeat.item.start else ''}
               ${'last' if repeat.item.end else ''}
               ${'active' if item.active else ''">
        <a tal:attributes="href item.href" tal:content="item.title">title</a>
    </li>
</ul>

[编辑]
或者更好的是这样的：

<ul>
    <li tal:repeat="item mainnav"
        class="${('first ' if repeat.item.start else '') +
                 ('last ' if repeat.item.end else '') +
                 ('active' if item.active else '')}">
        <a tal:attributes="href item.href" tal:content="item.title">title</a>
    </li>
</ul>

Answer 3

您没有使用 tal:condition，它有一个目的。我不喜欢过度嵌套的条件，这会让你无处可去。
还没有测试过这个，但你可能会明白这个想法。

<ul>
    <tal:myloop tal:repeat="item mainnav">
        <li tal:condition="item.active" tal:attributes="class 
            'active first' if repeat.item.start 
            else 'active last' if repeat.item.end 
            else 'active'">
            <a tal:attribute="href item.href" tal:content="item.title"></a>
        </li>
        <li tal:condition="not item.active" tal:attributes="class 
            'first' if repeat.item.start 
            else 'last' if repeat.item.end else None">
            <a tal:attribute="href item.href" tal:content="item.title"></a>
        </li>
    </tal:myloop>
</ul>