首页 文章

使用角度材质从角度2中删除mat-selection-list中的选定行

提问于
浏览 次
2

我使用角度材料在角度2中实现了一个简单的表 . 实现了两个方法，首先是 transferSelectedRows ，它从表中选择行时将行数据推送到Selected Rows部分 .

第二种方法是 removeSelectedRows 其中选择行并单击 Remove Selected Rows 按钮应该删除相应的列表项 . 但是我无法实现删除功能来拼接 mat-selection-list 中的项目...

任何人都可以帮帮我......！

请在这里访问我的示例.. https://stackblitz.com/edit/angular-nwjqsj-au6ho8?file=app%2Faccount.component.scss

下面显示的是我的示例角度2应用程序的输出 .

enter image description here

我在终端和控制台中收到以下错误 .

enter image description here

enter image description here

angular angular-material

1 回答

  • 2

    UPDATED ：

    因为angular5，你甚至可以用一个简单的数组来完成它 . 有关实例，请参阅here .

    首先将 mat-selection-list 绑定到html文件中的数组 selectedRowsChecked .

    <mat-selection-list #rows [(ngModel)]="selectedRowsChecked">
    <mat-list-option *ngFor="let i of selectedRows" [value]="i">
        {{i.position}}-{{i.name}}-{{i.weight}}-{{i.symbol}}
    </mat-list-option>
</mat-selection-list>

    然后在您的组件中定义该数组

    selectedRowsChecked = [];

    然后在 removeSelectedRows 方法中使用它 .

    removeSelectedRows() {
    this.selectedRowsChecked.forEach(item => {
      let index: number = this.selectedRows.findIndex(d => d === item);
      if(index > -1) {
         this.selectedRows.splice(index, 1);
      }
    });
    this.selectedRowsChecked = [];
}
    回复于

相关问题