Aurelia - 按名称

时间:2015-12-03 22:19:39

标签: javascript aurelia aurelia-binding

假设我们有一个自定义元素,用于呈现某些内容的列表。它是一个选择器元素,因此它不会如何呈现某些

问题是这个某些东西是非常通用的,并且有实际渲染它的自定义元素。例如,对于国家/地区,我们为一般元素添加了一个标记图像 - 一个fontawesome图标,用户的声誉等。

我想拥有什么

现在我想传递我要渲染某些东西的自定义元素的名称。所以不是这个

<selector data.one-way="options" selected.two-way="selected"></selector>

有像

这样的东西
<selector element="country" data.one-way="options" selected.two-way="selected"></selector>

在我想要的selector

<${element} content.one-way="el" repeat.for="el of data"></${element}>

我得到了什么

不幸的是,上面的代码呈现为 htmlescaped

<country content.one-way="el" repeat.for="el of data"></country>

所以,

是否有一种或多或少的干净方式来实现这一目标?基本上我想传递我想要在我的选择器自定义元素中呈现的指定自定义元素。 This post and the answer there与我的问题无关。

here所述使用compose ......好吧,这是一个选项,但我希望在CustomElement js文件中有不同的自定义元素和稍微不同的逻辑。

谢谢!

UPD

嗯,通过在视图中添加类似switch语句的内容,显然可以做到这一点

<country ... if.bind="el.type === 'country'"></country>
<phone ... if.bind="el.type === 'phone'"></phone>
<user ... if.bind="el.type === 'user'"></user>

但这会使selector元素依赖于countryuser等等。所以我不喜欢这样。

2 个答案:

答案 0 :(得分:3)

我认为最简单的方法是使用compose标记(就像你提到的那样):

<compose model.bind="item" view-model="widgets/${item.type}"></compose>

答案 1 :(得分:1)

我发现了几种可能的解决方案,它们看起来可能更复杂。

void __stdcall Camera::TransferEndCallback(HANDLE hCamera, DWORD dwFrameNo, DWORD dwWidth, DWORD dwHeight, WORD wColorArray, PBYTE pbyteRaw, PVOID pvContext)
{
    ((Camera *)pvContext)->ThisTransferEndCallback(hCamera, dwFrameNo, dwWidth, dwHeight, wColorArray, pbyteRaw);
}

您可以在http://www.sitepoint.com/extending-html-aurelia-io-way/

找到更多详细信息