Angular - [innerHTML] 在 Internet Explorer 上不起作用

Question

I have a seperate JSON file for translation, it looks like this:

  Title: "Welcome to <br> COVID-19 mitigation schemes",
  ...
} 

In angular when I write

<p [innerHTML]="Title"> {{Title}} </p>

It works fine on Chrome and Firefox, but on IE11, it still displays the <br> tag.

Any suggestions?

PS - I need the JSON files for translations. The reason I needed <br> was because the text was wrapping at the hyphen on COVID-19. There may be other solutions, but I also need to add <a> tags in the middle of the given text.

I could use DomSanitization but ngx-translate does not work properly when I use it in TS file, even when I subscribe to the event. The code for that looks like this

this.translateService.get(`Title`).subscribe(data => this.title = data)

Any help would be great!

Answer 1

use this one:

 bypassSecurityTrustHtml(text: string) {
    return this.sanitized.bypassSecurityTrustHtml(text)

  }