Heena
Heena

Reputation: 1773

Transferring Rows from one table to another in angular 2 using angular material

I have implemented simple table in angular 2 using angular material...I have taken two mat-table where the selected rows from first table are transferred to second table on clicking Move To Table 2 and vice versa on clicking Move To Table 1

But as I select and Click on Move To Table 2 , the row from my first table is getting spliced and transferred but as do the same for the second row, I am getting the previously transferred row again in my second table.

Sample Example

Below shown is my output.

Initially when I transfer first row , its getting spliced and moved to second table . enter image description here

But when I transfer second row ,the previously moved row is again added in the second table. enter image description here

Upvotes: 1

Views: 1875

Answers (2)

Rohith
Rohith

Reputation: 1

Clearing the selection did not allow me to move the checked items back to table 1. This worked for me instead:

moveToTableTwo(){
   ...
   this.selection.deselect;
}

Upvotes: 0

Vivek Doshi
Vivek Doshi

Reputation: 58563

That is because you are not clearing the selection ,

All you need to do is clear the selection once the transfer from one table to another is finished

Add this.selection.clear(); this at the end of moveToTableTwo() , like :

moveToTableTwo(){
   ...
   this.selection.clear();
}

Upvotes: 3

Related Questions