-1

I've created Dynamic HTML (dropdowns) using TypeScript. When I try to show as innerHTML its shows options as text and not dropdown.

{{question.question}}
<div [innerHTML]="question.question" class="question-text"></div>

enter image description here

It should actually show me DropDowns..

Ubiquitous Developers
  • 3,637
  • 6
  • 33
  • 78
  • 1
    try to use DomSanitizer (https://angular.io/api/platform-browser/DomSanitizer) and its `bypassSecurityTrustHtml()` method. Process your HTML with this function prior to passing it to `innerHTML` property – Andriy Nov 27 '20 at 18:26

2 Answers2

0

Wrap the html string in back quotes (` `) such that it is treated as a template string, also we can inject variables inside this string using `My name is ${name}!` It is a native javascript ES6 feature so would work with any framework that uses javascript

Shubhashish Verma
  • 29
  • 4
0

Angular will not let you render any HTML on the page as it might contain unsafe content. You have to tell Angular explicitly that your string is a safe string to render as HTML element.

The easiest way is to create custom pipe. Check the answer in this thread

Kayasit R.
  • 191
  • 4