Динамическая вставка пользовательских элементов aurelia

test.html

<gid>
  <grid-col prop1=""></grid-col>
  <grid-col-checkbox prop1=""></grid-col-checkbox>
  <grid-col-radio prop1=""></grid-col-radio>
  <grid-col-custom prop1=""></grid-col-custom>
</grid>

Тестовый класс экспорта test.js {}

==============

сетка.html

 <table>
   <tbody>
     <td>test</td>
      =======
       <template classs="foo-class" repeat="">

       </template>
       ======
    </tbody>
  </table>

grid.js экспортирует класс Grid {}

Я хочу вставить следующие вещи в тело таблицы. чтобы они повторялись для всех данных

 <grid-col prop1=""></grid-col>
 <grid-col-checkbox prop1=""></grid-col-checkbox>
 <grid-col-radio prop1=""></grid-col-radio>
 <grid-col-custom prop1=""></grid-col-custom>

Может ли кто-нибудь помочь, как мы можем это сделать?


person Srinu Vasulu    schedule 18.02.2016    source источник


Ответы (1)


Вы можете создать шаблон для строки таблицы:

моя-таблица-строка-template.html

<template>
    <td>
        <grid-col prop1=""></grid-col>
    </td>
    <td>
        <grid-col-checkbox prop1=""></grid-col-checkbox>
    </td>
    <td>
        <grid-col-radio prop1=""></grid-col-radio>
    </td>
    <td>
        <grid-col-custom prop1=""></grid-col-custom>
    </td>       
</template>

ПРИМЕЧАНИЕ. вы можете опустить элементы <td></td>, если они уже есть в ваших компонентах grid-col-x.

затем использовать только

<require from="my-table-row-template.html"></require>

<tr repeat.for="item of items">
   <my-table-row-template item.bind="item"></my-table-row-template>
</tr>

ССЫЛКА: http://aurelia.io/docs.html#/aurelia/framework/1.0.0-beta.1.1.3/doc/article/cheat-sheet/4

person weagle08    schedule 21.02.2016