title: How to pass selected row value of table to button click event - Material design - Angular 6
body: <p>my previous question was not clear. Allow me to ask again clearly as I'm struggling complete my task. </p>
  
  <p>I've mat-table along with checkbox for every row. (No master checkbox). whenever I select the row I should send the values of the selected row to button which is outside of the table.</p>
  
  <p>[if I have a button inside the table, I could do that by accessing the default <strong>ELEMENT</strong> from <code>*matCellDef="let element"</code> variable if the button present inside the table.</p>
  
  <p>But I don't know how to pass the selected row value to the button.  I've to do routing based on the value from the selected row.</p>
  
  <p>so far I've.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div&gt;&lt;button mat-button  [disabled]="!checkedbtn" (click)='linktomynxtpage()'&gt;link to another page&lt;/button&gt;&lt;/div&gt;
  
  &lt;table #demoTable mat-table [dataSource]="sample" multiTemplateDataRows&gt;
  // some ng-container with &lt;th&gt;&lt;td&gt;
  
   &lt;ng-container *ngIf="isAdmin" matColumnDef="actions"&gt;
      &lt;th mat-header-cell *matHeaderCellDef&gt; Action &lt;/th&gt;
      &lt;td mat-cell *matCellDef="let element"&gt;     
        &lt;mat-checkbox class="select-checkbox" [(ngModel)]="checkedbtn" &gt;&lt;/mat-checkbox&gt;        
      &lt;/td&gt;
    &lt;/ng-container&gt;
  
    &lt;tr mat-header-row *matHeaderRowDef="displayedColumns"&gt;&lt;/tr&gt;
    &lt;tr mat-row style="text-align:left" *matRowDef="let element; columns: displayedColumns;" &gt;&lt;/tr&gt;
    &lt;tr mat-row *matRowDef="let row; columns: ['expandedDetail']" class="detail-row"&gt;&lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p><strong>TS</strong> </p>
  
  <pre><code>linktomynxtpage(){
      //some logics
      //passing row value. and doing routing
      this.nxtPage.navigate(['/home/particular-user'])
  
  }
  </code></pre>