Resolved: How to style a dynamically populated string – an interpolated string, in Angular?

Question:

I am using Angular – THE JS ANGULAR FRAMEWORK – and my code is something like this –
which outputs something like this – Server ID: 15 server status: offline
What is the best way to style ONLY the interpolated strings
either {{ serverID }} or {{ serverStatus }} – only selecting them,
without affecting the rest of the paragraph?
I tried wrapping the interpolated string with some HTML tags –
where of course this HTML element could be anything
– <div>, <span> another <p>
I just used div and span as an example, I could also add a class if I wanted to… and this works.
Now even if I use [ngStyle] or [ngClass] – I will still have to use some HTML element,
there doesn’t seem to be a way around it… which is fine.
But I would like to know if there are alternative ways to select the
interpolated string in Agular – what is best / common practice & most effective ?

To be abundantly clear – I am asking how to select the interpolated tags – not how to write css
so no need for css code samples, and maybe please don’t just repeat the exact same example
that I already listed, and pretend is a completely new solution that you just came up with
– you can just say the ‘span method’, or wrapping in a HTML tag seems to be the best way, something like this… Thank you.

Answer:

Your solution – listed in the details – the span method or any html tag, seems to be the best one

If you have better answer, please add a comment about this, thank you!