Unable to load the POPUP in angular using angular

Question

I have created a sample stackblitz demo implementing a simple angular material table in the popup component.

I have also taken an empty table where I am pushing the selected table rows from my first table to second empty table.

But the problem is here I am unable to run the stackblitz example, I tried out various ways to fix the issue but I am unable to find the solution.

Can anybody please help me out in resolving the issue "popup undefined"

And also when I am transferring table rows to the empty table , I am unable to select the checkbox in the second table to remove them back in the first table.

Please access my sample demo here.

Below shown is the screenshot of the error.

Answer 1

You have not imported OpenPopup in your main.ts.

Make the following changes

main.ts:

Import {TableComponent,OpenPopup} from './path'

tableComponent.component.ts

import { MAT_DIALOG_DATA, MatDialogRef, MatDialog } from '@angular/material';

Answer 2

Import your dialog module separately

import {MatDialogModule} from '@angular/material/dialog';

instead of

import {MatDialogModule,...,...} from '@angular/material';

Working link : https://stackblitz.com/edit/angular-table-data-swap-y7sbxp?file=main.ts