在angular2中递归循环组件，其中控制数组作为输入

Question

我想以递归方式循环一个具有ControlArray和数组作为输入的组件模板。我将这些控件添加到此处的父控件组http://plnkr.co/edit/5GZzLYbHA1k5KgK8DU9x?p=preview

问题是当我在模板上应用ngFor时，文本会在错误的位置重复出现。这个plunker演示有什么问题导致数据显示在错误的位置？

当我提交表单时，我得到了完美的数据，但视图不正确。在递归循环模板中传递控制数组的最佳方法是什么？

<div *ngFor="#Array of ChangedDataForm;#i=index">
    <complaint [ComplaintsControl]="Form.controls['Complaints']" [ComplaintsData]='Array.Complaint'></complaint><br>
    <div *ngFor="#Opdata of Array.Complaint[0].Operations;#j=index">
        <operations [OperationsData]='Opdata' [OperationsControl]="Form.controls['Operations']"></operations>
        <br>
        <div *ngFor="#partsData of Opdata[j].Parts">
           <Parts [ServicePartsData]='partsData' [servicePartsControl]="Form.controls['Parts']"></Parts>
        </div><br>
    </div>
</div>

这就是我将控制数组和数据传递给子组件的方式。当我传递控制数组时，子组件将控制组添加到数组中。