JAVASCRIPT

how to open component as a dialog in angular

//For this We need need Angular Material(MatDialog)
//Make sure you import matDialog in app module like:
import { MatDialogModule } from '@angular/material/dialog';

//Now Go to ts file from where you want to open Dialog and Do following:
const dialogRef = this.dialog.open(SampleComponent,
      { data: { ID: data.Id, Name: data.Name }, width: '1000px', height: '1000px' }
    );
//Note: Component Name is: SampleComponent and we are passing data to the dialog component.
//and to receive this data in Sample Component We need to inject it in constructor like this.

@Inject(MAT_DIALOG_DATA) public data: any