Angular / Angular Material - How to Project Content with inside MatDialog.open(Component)

Question

For example if I have Component:

@Component(
  selector: "demo-comp",
  template: `
    <div>
      Some text...
      <ng-content></ng-content>
    </div>
  `
)
export class DemoComponent {
  constructor(public dialogRef: MatDialogRef, @Inject(MAT_DIALOG_DATA) public data)
  // ...
}

Is there a proper way to project content while opening a dialog? I know only this way to open the dialog... which not allowing me to pass content to the slot.

// Inside another component
constructor(dialog: MatDialog) {}
open = () => {
  this.dialog.open(DemoComponent, {/** someConfig */ })
}

NOTE: I accept answers with portals and etc.

Answer 1

there is no dialog API way to project content inside of the dynamic component. However you could create wrapper component, which would render the original component with some content projected inside of it

@Component({
  ...,
  template: `<demo-component [data]="data"><div>project something</div>`
})
exprt class DemoProjectionDialogComponent {
...
}
...
this.dialog.open(DemoProjectionDialogComponent, {...})