如何获得的，其在Angular2

Question

动态创建我要设计基于以下图像

design of my html page

显示用户点击多个文本框的要求，但文本框中的值，每当我点击+在文本框按钮值重复我的HTML是像下面

<div class="form-group" style="margin-top: -10px;"> 
    <div class="col-lg-10" *ngFor="let rowplus of rowplus" style="margin-top: 12px;"> 
     <input type="text" placeholder="Command" class="form-control" [(ngModel)]="cli.cmd[rowplus[0]]" name="cmd" /> 
    </div> 
    <div class="col-lg-2" style="margin-top: 12px;"> 
     <button class="btn btn-success" (click)="addrow()"><i class="fa fa-plus"></i></button> 
     <button class="btn btn-danger" (click)="subrow()"><i class="fa fa-minus"></i></button> 
    </div> 
</div> 

如何避免这种代码以及如何使用动态值[（ngmodel）。

Answer 1

不要使用相同的变量的所有文本框

[(ngModel)]="cli.cmd" 

您可以使用index

<div class="col-lg-10" *ngFor="let rowplus of rowplus; let idx=index" style="margin-top: 12px;"> 
    <input type="text" id="command" placeholder="Command" class="form-control" [(ngModel)]="cli[idx].cmd" name="cmd" /> 
</div> 

或值存储在*ngFor迭代符变量rowplus

<div class="col-lg-10" *ngFor="let rowplus of rowplus" style="margin-top: 12px;"> 
    <input type="text" id="command" placeholder="Command" class="form-control" [(ngModel)]="rowplus.cmd" name="cmd" /> 
</div>