带有嵌套ngTemplateOutlet的Angular2*ngFor和带有文本输入的ngOutletContext

我正在尝试创建一个列表组件来包装项目。当列表项是对象时，这一切都很好，但当列表项是字符串时，即使使用trackBy索引，我也无法让它工作

呼叫代码：

<app-list [list]="_question.options" [title]="'Options'" [columnTemplate]="listBody" (onDelete)="onDeleteOption($event)"
    (onMove)="onMoveOption($event)" (onAdd)="onAddOption()">
</app-list>

<ng-template #listBody let-index="index" let-item="item" let-list="list">
    <td class="vertical-middle">
        <app-input [(ngModel)]="list[index]"></app-input>
    </td>
</ng-template>

因此，问题在于，当您开始更新输入字段时，项目是字符串，列表将重新呈现，焦点将丢失。根据我所读到的，这首歌应该可以解决这个问题。我尝试使用trackby，没有模板的额外复杂性，它确实如预期的那样工作。它只是在这种嵌套场景中不起作用。希望有一个为他们工作的时刻，我只是要确保我使用的对象

下面是正确的Plunk，希望它能更好地描述这个问题。

干杯

---

感谢yurzui提供的解决方案。似乎从上下文中删除该项，而只是将索引传递到上下文中解决了这个问题

---

有关更多详细信息，请参见上面的Plunks。

感谢yurzui提供的解决方案。似乎从上下文中删除该项，而只是将索引传递到上下文中解决了这个问题

---

有关更多详细信息，请参见上面的Plunks。

NgTemplateOutlet

#ngOutletContext

已被删除，因为自v4以来它已被弃用。

---

使用

NgTemplateOutlet

#ngTemplateOutletContext

代替

NgTemplateOutlet

#ngOutletContext

已被删除，因为自v4以来它已被弃用。 改用

NgTemplateOutlet

#ngTemplateOutletContext

<tr *ngFor="let item of list; let i = index; trackBy:trackListBy;">
<ng-template [ngTemplateOutlet]="columnTemplate" 
[ngOutletContext]="{item: item, index: i, list: list}"></ng-template>

trackListBy(index: number, item: T) {
    return index;
}