以角度2添加和删除动态文本框行

时间:2017-09-28 10:22:00

标签: angular

我在下面尝试了我的代码

<div class="form-group" *ngFor="let fieldValue of fieldValues; let last='last';">
    <div class="col-lg-5">
        <input type="text" name="name" [(ngModel)]="fieldValue.name" class="form-control">
    </div>
    <div class="col-lg-5">
        <input type="text" name="value" [(ngModel)]="fieldValue.value" class="form-control">
    </div>
    <div class="col-lg-2">
        <button class="btn btn-default" type="button" (click)="addFieldValue(fieldValue)" *ngIf="last">Add</button>
        <button class="btn btn-default"  type="button" *ngIf="!last" (click)="deleteFieldValue()">Delete</button>
    </div>
</div>

ts文件

export class AppComponent {
    private fieldValues: Array<any> = [];
    constructor() {
        this.fieldValues = [{
            name: null,
            value: null
        }]
    }

    addFieldValue(field) {
        this.fieldValues.push(field);
    }

    deleteFieldValue() {

    }
}

我的问题是,我必须动态添加字段,每当单击添加按钮时,应生成新字段,该字段为空,同时保留数组中的第一个字段。

enter image description here

谢谢你提前

0 个答案:

没有答案