Mat-table inside mat-dialog


I want to create a table inside a dialog box so when user clicks on a link they can see the table in a dialog box.

I created mat-table and dialog box. Only problem is function takes components as a parameter so dialog box shows all of the page again. Is there a way to give it tables id or something so that i can only show specific table in it?

constructor(public dialog: MatDialog) { }
openDialog() {;

<a value="case1" (click)="openDialog()">Click for details</a>


In the ts thats open the popup:, {
  data: {id: someId}

In the popup:

    public dialogRef: MatDialogRef<DialogOverviewExampleDialog>,
    @Inject(MAT_DIALOG_DATA) public data: DialogData) {
    if( {
     // do something

Answered By – oz1985oz

Answer Checked By – David Goodson (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.