如何在Aurelia repeat.for中有条件地添加或删除CSS类？

我有一个数组，我正在从中构建一个

，我希望能够使用CSS将

第一个

项标记为禁用，但是我无法获得正确的语法

以下是我所拥有的：

<select select2 value.bind="selectedItem">
    <option repeat.for="item of stuff" model.bind="item" class="${${first} ? 'disabled selected hidden' : ''">
        ${item.key}
    </option>
</select>

${item.key}

这是一个

Plunker

非常相似，可以用作试验台

---

我遗漏了什么？

您的示例不完整，但我想应该是这样的：

class="${item.first ? 'disabled selected hidden' : ''}"

另外，如果您在VM中有

first

属性，比如

stuff

，您可以编写：

class="${$parent.first == item? 'disabled selected hidden' : ''}"

更新：

普朗克（）

---

我担心没有工作：-（我添加了一个

Plunker

，以便于测试。请注意，我想利用Aurelia文档中包含的

$first

，而不是在VM上创建另一个属性。结果我有两个额外的大括号！因此它应该是

${$first？..

而不是

${${first}？..

是，右侧语法为

class=“${$first？”已禁用选定隐藏“：”}”

<option repeat.for="thing of things" model.bind="thing">${thing.name} ${$first | stringify}</option>

Contextual items availabe inside a repeat template:

$index - The index of the item in the array.
$first - True if the item is the first item in the array.
$last - True if the item is the last item in the array.
$even - True if the item has an even numbered index.
$odd - True if the item has an odd numbered index.