What is the purpose of innerHTML?

The innerHtml is a property of HTML-Elements, which allows you to set it's html-content programmatically. Let's display the below html code snippet in a <div> tag as below using innerHTML binding,

and define the htmlSnippet property from any component

export class myComponent {
htmlSnippet: string = '**Hello World**, Angular';
}

Unfortunately this property could cause Cross Site Scripting (XSS) security bugs when improperly handled.