从 Angular 的 mat-table 中显示的 arraylist 中删除对象

Question

我希望从一个垫子表中删除一行。这是我的按钮和（点击）方法的样子：

    <mat-cell *matCellDef="let element; let i = index">
          <button mat-raised-button color="warn" (click)="deleteApplication(i)">
               Delete
          </button>
     </mat-cell>

这是我的component.ts中的函数：

    deleteApplication(index: number){
    if (index > -1) {
        let removeIndex = this.applicationData.Items;
            this.applicationData.Items.splice(removeIndex[index], 1);
            removeIndex = new MatTableDataSource(removeIndex);
            console.log('new array:', removeIndex.filteredData);
       }
    }

数据源是我在 AWS 上托管的 DynamoDB 数据库中的一个数组列表。这是它的样子，在我的控制台中：

    {Items: Array(8), Count: 8, ScannedCount: 8}
    Count: 8
    Items: Array(8)
    0: {completed: false, candidate: "1", application: Array(3), timestamp: 1569837830615}
    1: {completed: false, candidate: "2", application: Array(3), timestamp: 1569837830615}
    2: {completed: false, candidate: "3", application: Array(3), timestamp: 1569837830615}
    3: {completed: false, candidate: "4", application: Array(3), timestamp: 1569837830615}
    4: {completed: false, candidate: "5", application: Array(3), timestamp: 1569837830615}
    5: {completed: false, candidate: "6", application: Array(3), timestamp: 1569837830615}
    6: {completed: false, candidate: "7", application: Array(3), timestamp: 1569837830615}
    7: {completed: false, candidate: "8", application: Array(3), timestamp: 1569837830615}
    length: 8
    __proto__: Array(0)
    ScannedCount: 8
    __proto__: Object

我的问题是，当我点击给定行上的删除按钮时：

1. 总是删除索引号 0，即使我点击了不在索引 0 上的行

2. 我的视图没有渲染，即删除的行没有消失

Answer 1

splice() 方法的第一个参数是开始索引，即开始更改数组的索引。

在下面显示的代码中，您不是将索引作为第一个参数传递，而是在索引处传递值。

this.applicationData.Items.splice(removeIndex[index], 1);

更改该语句以传递索引。

this.applicationData.Items.splice(index, 1);