Strings with HTML Tags

You can render HTML tags in translations using the t attribute or the translate pipe.

To render a translation containing HTML tags with the pipe, bind the translated value to innerHTML.

Consider a translation for the key hello_peter with the English value Hello <b>Peter</b>!

You can render it using the translate pipe as follows:

<div [innerHTML]="'hello_peter' | translate"></div>

To render a translation containing HTML tags with the t attribute, enable the isHtml input on TDirective.

<div t key="hello_peter" [isHtml]="true"></div>

Security

Tolgee sanitizes HTML tags in translations. It removes all HTML tags and attributes that are not allowed.

The HTML is automatically sanitized for both the t attribute directive and the translate pipe. However, if you don't expect HTML strings in your code, avoid passing translated values to innerHTML.

<b onmouseover=alert('XSS testing!')>Hello Peter!</b>

The above code is sanitized to: <b>Hello Peter!</b>