I have a database variable from which I get this, for example:
hello, `<br />` have a good day,
It prints the <br /> to my screen. How could I tell html that
is a line break?
My variable is called greeting and it is an array from which I use a for to print everything, but I used that little text as an example.
So I tried with innerHTML but it doesn't work:
<i id="break" class="textTitle">{{ greeting }}</i>
<script>
document.getElementById("break").innerHTML = "<br/>";
</script>
UPDATE
my solution was:
<div [innerHTML]="greeting" ></div>
Use the dangerouslySetInnerHTML prop:
<i id="break" class="textTitle" dangerouslySetInnerHTML={greeting}></i>
Your original code uses innerText under the hood to set the content of the element. That's why it gets interpreted as text instead of HTML code.
<i id="break" class="textTitle">{{ greeting }}</i>
In must be something to do with the way you interpreter is treating the text, as this should normally work fine:
document.getElementById("break").innerHTML = "<br/>";<body>
<h1>Hi</h1>
<h1 id="break"></h1>
<h1>There</h1>
</body>