如何在angular2中使用ngFor for Form Array时显示数据？

Question

现在，我正在尝试使用ngFor在我的Html中显示json数据，但我还需要使用表单数组，所以我不能使用ng For for json数据，我必须使用ngFor来表示我的表单阵列。那么如何才能在html中显示数据。

这是我的组成部分：

 import { Component, OnInit,HostListener,NgModule } from '@angular/core';
import {FormGroup, FormControl, Validators,FormArray,FormBuilder} from '@angular/forms';
import {HomepageService} from './homepage.services';
import {ToolUsing, Tool,Tooldetail} from './homepage.interface';

@Component({
  selector: 'homepage',
  templateUrl: './homepage.component.html',
  styleUrls: ['./homepage.component.css']
})

export class Homepage {
  toolsearchform:FormGroup;
  toolsubmitform:FormGroup;
  toolform:FormGroup;
  toolusing: ToolUsing;
  tool:Tool;
  toolinfos: Array<any>= [];
  // toolinfos:any[]=[];
  comment: FormControl;
  i:number;
  constructor(private homepageservice: HomepageService, private fb:FormBuilder) {
    this.toolsearchform= new FormGroup({
      'barcode':new FormControl(),
    })
    this.toolsubmitform=new FormGroup({
      'sender':new FormControl(),
      'operator':new FormControl(),
       tool:new FormArray([
       ]),
    })
  };
    buildForm=():void=>{
      const toolControls=<FormArray>this.toolsubmitform.controls['tool'];
      this.toolinfos.forEach((tl:Tool)=>{
          toolControls.push(this.createToolFormGroup(tl))
          console.log(toolControls)
      })

    }


    removeTool(i: number, control) {
           control.removeAt(i);
       };


    removeToolForm(i:number){
      let control=<FormArray>this.toolsubmitform.controls['tool'];
      this.removeTool(i,control);
    }


  createToolFormGroup(tl:Tool){
    return this.fb.group({
      uuid:[tl.uuid],
      count:[''],
      comment:[''],
    })
  }
  onToolinfo(){
  this.homepageservice.checktoolinfo(this.toolsearchform.value)
    .subscribe(
      data=>{
        this.toolinfos=data;
        this.buildForm();
      }
     )

  };

这是我的HTML：

 <div formArrayName='tool'>
            <table class="table table-bordered">
                        <thead class="table-head">
                            <tr >
                                <th>index</th>
                                <!-- <th class="uuid">uuid</th> -->
                                <th>barcode</th>
                                <th>toolsname</th>
                                                    </tr>
                        </thead>
                        <tbody >

                          <tr [formGroupName]="i" *ngFor="let tool of toolsubmitform.controls.tool.controls; let i=index">
                         <td scope="row">{{i+1}}</td>
                         <td >{{toolinfos[i].barcode}}</td>
                         <td>{{toolinfos[i].toolsName}}</td>                         
                         <td><input type="text" formControlName="count"></td>
                         <td><input type="text"  formControlName="comment"></td>
                                <td><span class="remove" (click)="removeToolForm(i)">delete</span></td>
                            </tr>
                        </tbody>
                    </table>
                  </div>