0

我试图向 dce-image 添加一个额外的源以进行进一步的操作，例如一个替代源来执行一些 JavaScript 操作。

想要的输出应该是这样的：

<img src="path/to/foo.png" data-altsrc="path/to/bar.png">

问题是我正在使用的 dce - 它像这样遍历“图像”：

<f:for each="{dce:fal(field:'image', contentObject:contentObject)}" as="fileReference">
    <f:image src="{fileReference.uid}" treatIdAsReference="1" />
</f:for>

因此，如果我要向其中插入多个图像，我知道哪些图像是正常来源而哪些图像是备用来源的图像之间没有真正的关系。

因此，可以创建一个部分并为图像添加两个字段，我们可以将每个字段限制为一个图像。但是还有一个 for 循环，它不允许我访问第一个图像的第二个图像的源。

对于使用 dce 的用户来说，这应该是这些图像之间的可见关系。

我试图实现这样的目标：

<f:for each="{field.images}" as="images">
    <!-- want to achieve something like this -->
    <f:image image="{images.foo.src}" data-altsrc="{images.bar.src}">

    <!-- thats the normal way iterating through images -->
    <f:for each="{images.foo}" as="image">
        <f:image image="{image}" />
    </f:for>
</f:for>

另一个想法是首先遍历备用图像并将它们存储到一个数组中并在主图像上访问它们，但我不知道这是否可能，这也会限制用户对 dce 的可用性。

有没有办法用 dce-fluid 实现这一点？

提前致谢

4

2 回答 2

1

您必须使用流体视图助手的数据属性，然后通过内联调用获取图像的 uri。以下是如何实现：

 <f:image src="{fileReference.uid}" data="{altsrc: '{f:uri.image(src: \'{fileReference.uid}\', treatIdAsReference: 1}" treatIdAsReference="1"/>

这应该做的工作。

于 2017-08-04T09:11:14.783 回答
1

好吧，我想您可以扩展 sys_file_reference 表以从那里添加关系。所以你会有嵌套关系（从来没有这样做过，所以你必须尝试）。

您还必须在需要的地方将该字段添加到 tca 类型，这可能有点棘手。看看Tca types overrides。

您可以使用字段“alternative_reference”扩展 sys_file_reference 表并添加必要的 TCA 设置。然后您必须通过 FileRepository 检索 FileReferences 并使用 sys_file_reference 作为外部表（当然还有 sys_file_reference uid 作为标识符）。

FileRepository::findByRelation(
    'sys_file_reference',
    'alternative_reference',
    $uidOfActualSysFileReferenceRecord
);

另一种可能性是具有 2 个不同 sys_file_reference 关系的全新记录。该记录（例如：tx_ext_domain_model_imageset）将具有 image_default 和 image_alternate 字段，两者都将配置为 file_relations。那肯定行得通。

$defaultImages = FileRepository::findByRelation(
    'tx_ext_domain_model_imageset',
    'image_default',
    $uidOfRecord
);
$alternativeImages = FileRepository::findByRelation(
    'tx_ext_domain_model_imageset',
    'image_alternative',
    $uidOfRecord
);

我假设您确实具有创建记录、模型、tca 等方面的知识。

我个人更喜欢第二种方式，它更干净并且不会改变核心表结构。

还有第二个图像生成查看器，可以更好地满足您的需求

<img src="{f:uri.image()}" data-altsrc="{f:uri.image()}" />

但最好的方法可能是为此目的编写自己的 ViewHelper。您可以将对象（ImageSet）作为参数传递并在那里处理所有逻辑。所以你的模板会更简单，更容易阅读/处理。

于 2017-08-04T09:22:13.183 回答