Question

我对aurelia很新，而且我不知道这是否可能在aurelia上。

我有一个json有几个结果，

      "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"
         }

我想从这样的东西构建（这是伪代码，我不知道如何在aurelia中表示这一点：

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

这意味着我应该在type = BackgroundColor等时创建颜色输入，并将其链接到json的特定返回。

Answer 1

您可以使用文档中的示例以最简单的方式实现您要做的事情 -

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

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

如果您的JSON不是一个数组，您可以将其推入数组并动态添加并从DOM中删除它。

然后，您可以使用不同的表单来编辑具有相应表单输入字段的任何JSON对象的每种不同类型。

ex something.html -

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

用aurelia动态创建一个dom对象

1 个答案: