title: How can I return html with CSS classes from angular function in the HTML template?
body: <p>I have this list element where I call function with <code>[innerHTML]</code> which returns html elements and it is working, if I want some part of that html to be bolded. In this case the text from the - <code>difference.hours</code> will be bolded.</p>
  <p><strong>HTML</strong></p>
  <pre><code> &lt;li class=&quot;list-group-item&quot; [innerHTML]=&quot;getRemainingAppointmentDate(appointment.time_remaining)&quot;&gt;&lt;/li&gt;
  </code></pre>
  <p><strong>TYPESCRIPT</strong></p>
  <pre><code>return `Hours: &lt;strong&gt;${difference.hours}&lt;/strong&gt;`;
  </code></pre>
  <p>But i can't figure it out how can i give style to the elements.
  For example if i try</p>
  <pre><code>return `Hours: &lt;span class='red'&gt;${difference.hours}&lt;/span&gt;`;
  
  </code></pre>
  <p>then the given class is not applied to the returned text.</p>