Angular-Typescript将对象添加到数组-元素上的值删除

时间:2018-11-06 23:39:44

标签: angular typescript

当我在表中添加新元素时,其上的值将被删除。我试图在上面添加日志,日志显示该数组上有值。

<table class="table table-hover" [mfData]="testItems" #mf="mfDataTable" [mfRowsOnPage]="5">
                        <thead>
                            <tr>
                                <th scope="col">Test Item</th>
                                <th scope="col">Description</th>
                                <th scope="col">Linked</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr *ngFor="let t of mf.data; let i = index">
                                <td>
                                    <span *ngIf="t.id">{{ t.title }}</span>
                                    <div *ngIf="!t.id">
                                        <input class="form-control" placeholder="Title" value="{{t.title}}" [(ngModel)]="t.title" name="title" />
                                    </div>
                                </td>
                                <td>
                                    <span *ngIf="t.id">{{ t.description }}</span>
                                    <div *ngIf="!t.id">
                                        <input class="form-control" placeholder="Description" value="{{t.description}}" [(ngModel)]="t.description" name="description"  />
                                    </div>
                                </td>
                                <td><input type="checkbox" value="{{t.id}}" [checked]="t.selected" [(ngModel)]="t.selected" name="selected"></td>
                                <td *ngIf="!t.id"><a (click)="removeItem(i)" style="cursor:pointer" class="mdi mdi-close mdi-18px"><u>Remove</u></a></td>
                            </tr>
                        </tbody>
                        <tfoot>
                            <tr>
                                <td colspan="4">
                                    <mfBootstrapPaginator [rowsOnPageSet]="[5,10,25]"></mfBootstrapPaginator>
                                </td>
                            </tr>
                        </tfoot>
                    </table>

<a (click)="addItem()" style="cursor:pointer" class="mdi mdi-close mdi-18px"><u>Add Item</u></a>

这是打字稿代码:

    addItem(): void {
    console.log(this.testItems);
    this.testItems.push(new TestItem());
}

Screenshot

0 个答案:

没有答案