What is the difference between interpolated content and the content assigned to the innerHTML property of a DOM element?

When we enter some JavaScript expression within double curly brackets ‘{{ someExpression() }}’’ in our template, we get Angular interpolation. This is how dynamic content is added to a web page. We may achieve a similar effect by giving dynamic content to a DOM element’s innerHTML attribute. The distinction is because, with Angular, the compiler always escapes the interpolated content, i.e., HTML is not interpreted, and the browser shows the code with brackets and symbols rather than the interpreted HTML output. If the content is HTML, however, it is interpreted as HTML code in innerHTML.