Question

这是我的删除功能：

onRemoveTransaction(index : number){
    this.transactionsList.splice(index, 1);
    console.log(this.transactionsList);
}

我的模板有：

<tr *ngFor="let transactionDetails of transactionsList; let i=index">

            <td>
              <input type="text" name="trxNumber-{{i}}" value="trxNumber-{{i}}"
                     class="form-control" minlength="1" maxlength="20"
                     [(ngModel)]="transactionDetails.trxNumber" disabled/>
            </td>
            <td>
              <input type="number" name="amountDue-{{i}}" value="amountDue-{{i}}"
                     class="form-control" minlength="1" maxlength="20"
                     [(ngModel)]="transactionDetails.trxAmount"/>
            </td>
            <td>
              <input type="text" name="customer-{{i}}" value="customer-{{i}}"
                     class="form-control" minlength="1" maxlength="20"
                     [(ngModel)]="transactionDetails.customerId" disabled/>
            </td>
            <td>
              <input type="text" name="comments-{{i}}" value="comments-{{i}}"
                     class="form-control" minlength="1" maxlength="20"
                     [(ngModel)]="transactionDetails.comments"/>
            </td>
            <td>
              <input type="text" name="transactionType-{{i}}" value="transactionType-{{i}}"
                     class="form-control" minlength="1" maxlength="20"
                     [(ngModel)]="receiptType" disabled/>
            </td>
            <td class="text-center">
              <span *ngIf="transactionDetails.id != null; else showRemove">
                 <button type="button" title="Delete" class="btn btn-danger btn-md glyphicon glyphicon-trash text-danger"
                         [disabled]="disablePostBatch" data-toggle="modal"
                         data-target="#deleteTransactionModal" (click)="onDeleteTransaction(transactionDetails)">
                 </button>
              </span>
              <ng-template #showRemove>
                <button type="button" title="Remove" class="btn btn-danger btn-md glyphicon glyphicon-remove text-danger"
                        (click)="onRemoveTransaction(i)">
                </button>
              </ng-template>
            </td>
          </tr>

当我从列表中删除最后一条记录时，它工作正常，但是如果我从列表中间删除任何其他记录，它会中断并且不会显示图像中附加的值也有一个控制台as seen in this screenshot.

中的警告

Answer 1

删除值=＆＃34;＆＃34;在输入标签中已经解决了这个问题。从列表中删除中间记录时，索引会向上移动。

splice函数在删除最后一条记录以外的记录时没有正确更新我的列表

1 个答案: