Come posso aggiungere o rimuovere condizionatamente classi CSS in ripetizione di Aurelia.for?

Question

Ho una serie di elementi da cui sto creando un <select> e voglio poter contrassegnare l'elemento first come disabilitato utilizzando CSS, tuttavia non riesco a ottenere la sintassi corretta.

Ecco quello che ho:

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

s' HERE un Plunker abbastanza simili che può essere usato come un banco di prova.

Cosa mi manca?

Answer 1

Il tuo esempio non è pieno, ma credo che dovrebbe essere simile:

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

Inoltre se avete first struttura al VM, come stuff si scrive:

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

UPDATE:

Plunker (http://plnkr.co/edit/2xywp0)

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

Basta sintassi sbagliato qui: class="${${first} ? 'disabled selected hidden' : ''" dovrebbe essere class="${ $first ? 'disabled selected hidden' : '' }"

Da Aurelia docs:

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.