Создание динамического повторителя с включением ng-контента с Angular2

Я пытаюсь добиться универсального компонента, который связан с массивом произвольных объектов, который позволяет динамически добавлять и удалять строки, когда представление каждой строки также произвольно определяется с компонентами основным компонентом, который его использует.

Обратите внимание, чтоMasterComponent это произвольный компонент, который будет реализован для разных страниц и должен быть автономным и не определяться никакими метаданными или внешним источником.

То, что у меня есть, это следующие компоненты:

RepeaterComponent шаблон:

<input type="button" value="Add" (click)="addRow()">
<div class="repeater" *ngFor="let row of repeaterArray">
    <div class="repeaterRow">
        <input type="button" value="Remove" (click)="removeRow(row.rowId)">
        <ng-content select="row"></ng-content>
     </div>
</div>

МастерКомпонент шаблон:

<repeater [repeaterArray]="repeaterObj">
    <row>
        <field-textbox [data]="row.name" [label]="'Name'"></field-textbox>
        <field-textbox [data]="row.description" [label]="'Description'"></field-textbox>
    </row>
</repeater>

<field-textbox> компонент - это пользовательский компонент, который я использую для инкапсуляции простых входных данных, которые содержат некоторые дополнительные данные, которые мне нужно использовать.

MasterComponent содержит объект, который для этого экземпляра выглядит следующим образом:

repeaterObj = [
{
    "rowId": 1,
    "name": "First brand",
    "description": "First description"
},
{
    "rowId": 2,
    "name": "Second brand",
    "description": "Second description"
},
{
    "rowId": 3,
    "name": "Third brand",
    "description": "Third description"
}
];

У этого подхода есть две проблемы, для которых я не могу найти решение.

Селектор ng-content одинаков для всех строк, когда ngFor дублирует шаблон, в результате чего у меня остается только одинng-content точка включения после рендеринга.Там нет ссылки настрока переменная из объявления ngFor в<field-textbox> включенные директивы, поэтому я не могу правильно связать данные.

Есть ли лучший подход для реализацииRepeaterComponent это дало бы мне наименьшее количество усилий для создания новыхMasterComponents разных произвольных структур и разных шаблонов?

Ответы на вопрос(1)

Ваш ответ на вопрос