Deleting selected items from mat-list not working

Question

I have implemented a simple table in angular 2 using angular material ..Implemented two methods , first is transferSelectedRows which on selecting rows from table pushes the row data to Selected Rows section.

Second method is removeSelectedRows where on selecting the rows and clicking Remove Selected Rows button should delete the corresponding list items.But I am unable to delete the items from the mat-selection-list...

Can anybody please help me out ...!

please access my sample example here ..https://stackblitz.com/edit/angular-nwjqsj-au6ho8?file=index.html

Below shown is the output of my sample angular 2 app.

Answer 1

You can modify your removeSelectedRows() to filter the selected items in the table:

removeSelectedRows() {
    this.selection.selected.forEach(item => {
      this.selectedRows = this.selectedRows.filter(element => element !== item);
    });
  }