Home > OS >  Render html in Angular Material Table cell
Render html in Angular Material Table cell

Time:08-11

I am trying to add html content in angular material but the tags show as simple text in html for example "first line <br> .here should be a new line" How do I do it?

CodePudding user response:

You can use innerHTML attribute binding

<td mat-cell 
  *matCellDef="let element"
  [innerHTML]="element.name">
</td>

TS

const ELEMENT_DATA: PeriodicElement[] = [
  {
    position: 1,
    name: '<b>Hydrogen</b> <br>Test', 
    ...
  },
  ...
];

Output

Position Name
1 Hydrogen
Test

Stackblitz

  • Related