angular2 动态添加input输入框【转】

export class TComponent {

   username: any;
   id: number = 1;
   login:any = [{"username": "username" + this.id,"password": "pwd" + this.id}];

   addInput() {
       var number = this.login.length + 1;
       this.login.push({"username": "username" + number, "password": "pwd" + number});
   }

   removeInput(item) {
       console.log(item);
       let i = this.login.indexOf(item);
       console.log(i);
       this.login.splice(i, 1);
   }

}
<h5>动态添加表单</h5>
<div class="form">
   <div class="form-group form-group-sm" *ngFor="let i of login">
       <label class="col-form-label">用户名</label>
       <input class="form-control" [(ngModel)]="i.username" value="{{i.username}}">
       <label class="col-form-label">密码</label>
       <input class="form-control" [(ngModel)]="i.password" value="{{i.password}}">
       <button class="btn btn-link" (click)="removeInput(i)">Remove</button>
   </div>
   <button class="btn btn-link" (click)="addInput()">Add</button>
   {{ login | json }}
</div>

原文地址：https://my.oschina.net/u/2499632/blog/778603