Создание объекта dom на лету с помощью 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.


javascript aurelia
person Saikios    schedule 21.03.2016    source источник
comment
ваш json не кажется правильно сформированным. Однако value.bind="item.name" должно быть достаточно   -  person Fabio Luz    schedule 22.03.2016
comment
Привет, Фабио, достаточно связать его, но он как бы жестко закодирован, он не знает, является ли он цветом типа, текстом или текстовым полем компонента,   -  person Saikios    schedule 22.03.2016

Ответы (1)


arrow_upward
1
arrow_downward

То, что вы пытаетесь сделать, может быть достигнуто самым простым способом на примере из документации -

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, который у вас есть, который имеет соответствующие поля ввода формы.

бывший что-то.html -

<input type="color" value-bind="item.name" />
<textarea rows="5" type="text" class="form-control" value.bind="item.description"></textarea>
person PW Kad    schedule 22.03.2016
comment
Большое спасибо! Я справлюсь с этим, мне нужно будет создать специальную папку со всеми моими типами. Вы Патрик из команды Аурелии?, не знал, что вы, ребята, нашли время, чтобы ответить и здесь! - person Saikios; 22.03.2016