can import module html tag in modal whit a function?

my example is the next in the modal html:

<h1 mat-dialog-title class="title-dialog">
    <b>{{ data.title }}</b>
<div class="body_modal">
    {{ data.body }}

modal code ts:

constructor( public dialogRef: MatDialogRef<GeneralComponent>,
    @Inject(MAT_DIALOG_DATA) public data: any) {}

code in the component where I call the modal html:

<div class="col-md-2">
        <div class="ico-image">
          <img src="assets/icons/complete.svg" (click)="this.openning()"/>

code in the component where I call the modal ts:

showModal( name,body) {
const title = name;
const body = body;
const dialogConfig = new MatDialogConfig();
dialogConfig.disableClose = true;
dialogConfig.autoFocus = true; = {
  id: 1,
  title: nombre_titulo,
  body: body_graphic,
};, dialogConfig);

)  }

With this code the modal is shown in text, I want to show the component inside the modal, thanks for your help

1 answer

  • answered 2021-05-15 10:46 Hokhy Tann

    Use <pre> tag to encapsulate the inner component in your modal template.