Search code examples
angularangular-materialangular-material-table

Angular material insert html string


Is there a way i can insert a whole html string from typescript for example:

I need this as each time info is of a different HTML type

 const ELEMENT_DATA: PeriodicElement[] = [
     {
    position: 1,
    info: '<span class="colorMe"> {{information}} </span>', 
    
  },
 {
    position: 2,
    info : '<img [src]="element.imageUrl" />', 
    
  },
  ...
];`

And html:
<td mat-cell 
  *matCellDef="let element">{{element.info}}
</td>

Solution

  • you can do it like this: <div [innerHTML]="element.info"></div>

    maybe you need to sanitize your HTML first