Wie Sie clientseitige Daten mit Aurelia anzeigen lassen

Question

Gibt es einen Weg in Aurelia zu sagen 'Wenn x == dieser, dann zeige diese'?

To be specific, I have an array of data that looks something like this: 
[ 
    {objectID: 1, customDataArray: [1,2,3,4], customDataType: { cdt: "Troops" }} 
] 

Dieses Array hat offensichtlich mehrere Zeilen, die oben wie die aussehen, wo es mir eine Reihe von benutzerdefinierten Werten ist vorbei, die ich verweisen müssen. Diese Werte könnten die IDs verschiedener "Gruppen" in unserem System sein. Deshalb übergeben wir ein Objekt, das enthält Typ von benutzerdefinierten Daten ist es. z.B. "Truppen"

Also, was passiert ist auf Aktivieren, ich hole all diese Daten von meiner API und speichert es in einer Variablen. Nun, basierend darauf, ob der benutzerdefinierte Datentyp "Truppen" oder etwas anderes ist, möchte ich ein anderes Eingabe-Label anzeigen. Zum Beispiel, wenn es "Truppen" ist, möchte ich eine Bezeichnung anzeigen, die "Eingabetrupps-IDs" und so weiter sagt.

Auch, manchmal ist der customDataType nicht erforderlich, daher wird er als null angegeben. In diesem Fall möchte ich etwas anderes zeigen. Nicht sicher, wie Sie mit diesem umgehen ..

Answer 1

Das benutzerdefinierte Attribut if oder das benutzerdefinierte Attribut show würde funktionieren. Leider haben wir keine switch oder else Art von Setup.

<label if.bind="p.customDataType.cdt === 'Troops'">Input Troop Ids</label> 
<label if.bind="p.customDataType.cdt !== 'Troops'">Something Different</label> 

Answer 2

Sie könnten versuchen, wenn if.bind für diese nützlich sein könnte, wie weiter unten:

<ul> 
    <li repeat.for="obj of data" if.bind="obj.customDataType"> 
     <span>${obj.customDataType.cdt}</span> - 
     <strong repeat.for="cda of obj.customDataArray">${cda}, </strong> 
    </li> 
    <li repeat.for="obj of data" if.bind="!obj.customDataType"> 
     <span>No CustomDataType</span> 
     <strong repeat.for="cda of obj.customDataArray">${cda}, </strong> 
    </li> 
    </ul> 

ist hier ein Plunker, die diese in Aktion zeigt: https://gist.run/?id=21991c490810a4acf2e38cec99614bbd