Erstellen eines dom-Objekts im laufenden Betrieb mit Aurelia

Question

Ich bin ziemlich neu auf Aurelia, und ich weiß nicht, ob dies auch auf Aurelia möglich ist.

ich eine json mit mehreren Ergebnissen haben,

 "colors":[ 
     { 
      "text":"#45454", 
      "name":"background", 
      "id":1, 
      "type":"BackgroundColor" 
     } 
     "Description":[ 
     { 
      "text":"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut porta sapien condimentum sagittis lobortis. Praesent molestie massa mi, eu volutpat libero condimentum in. Maecenas ultricies justo mi, eu vehicula nibh tristique vitae. Aliquam rhoncus ultrices fermentum. Duis id sapien efficitur, iaculis sapien non, laoreet felis. Aliquam dapibus commodo enim. Cras ultrices tempus justo, nec sagittis magna rutrum a. 

Nullam porttitor varius lacinia. Aliquam eleifend ante tortor, non suscipit purus hendrerit eget. Ut sit amet elit mollis, venenatis tortor cursus, ornare ex. Aliquam egestas dui odio, quis malesuada ex feugiat in. Cras scelerisque, sem vitae maximus sagittis, velit orci pharetra libero, eget condimentum tortor neque in metus. Donec gravida fermentum imperdiet. Vivamus a lorem et metus maximus sollicitudin vitae eget lacus. Aliquam erat volutpat. Sed ultrices magna eget nunc venenatis porttitor. Nullam hendrerit ut mi et fermentum. Duis id sollicitudin tellus, a ultricies eros. Cras semper purus at convallis semper. Curabitur aliquet venenatis magna, a eleifend eros maximus eu. Duis ut iaculis velit, quis commodo urna. Quisque lacinia efficitur elit ut mollis.", 
      "name":"description", 
      "id":1, 
      "type":"textarea" 
     } 

ich von diesem, so etwas bauen möchte (diese Pseudo-Code ist, ich weiß nicht, wie dies in aurelia darzustellen:

<input type="color" value-bind="item.name:background" /> 
<textarea rows="5" type="text" class="form-control" value.bind="item.name:description"></textarea> 

Das bedeutet, dass ich eine Farbeingabe in th wenn type = Background und so weiter, und es mit einer bestimmten Rückkehr eines json.

Answer 1

Was Sie versuchen zu tun, kann erreicht werden, schaffen sollte e einfachste Weg, um das Beispiel aus der Dokumentation mit -

this.items = [ 
    { type: 'something' }, 
    { type: 'somethingElse' } 
] 

<template repeat.for="item of items"> 
    <compose model.bind="item" view-model="widgets/${item.type}"></compose> 
</template> 

Wenn Ihr JSON kein Array ist, könnte man es nur auf das Array eindrücken und dynamisch hinzufügen und entfernen es so oder so aus dem DOM.

Dann können Sie unterschiedliche Formulare für die Bearbeitung jedes anderen Typs von JSON-Objekten haben, die über die entsprechenden Eingabefelder verfügen.

ex something.html -

<input type="color" value-bind="item.name" /> 
<textarea rows="5" type="text" class="form-control" value.bind="item.description"></textarea>