title: Transferring Rows from one table to another in angular 2 using angular material
body: <p>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</p>
  
  <p>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.</p>
  
  <p><a href="https://stackblitz.com/edit/angular-table-data-swap-mlqthx?file=app%2Faccount.component.html" rel="nofollow noreferrer">Sample Example</a></p>
  
  <h2>Below shown is my output.</h2>
  
  <p>Initially when I transfer first row , its getting spliced and moved to second table .
  <a href="https://i.stack.imgur.com/63gti.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/63gti.png" alt="enter image description here"></a></p>
  
  <p>But when I transfer second row ,the previously moved row is again added in the second table.
  <a href="https://i.stack.imgur.com/no3R8.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/no3R8.png" alt="enter image description here"></a></p>