Why is the data from the database not displayed?

Question

Angular

The essence of the problem is that when loading the page, the data that I get from the database is not displayed when using this method:

let div = document.getElementById("keywords");
         let arr = div.innerText.split(" ");
         div.innerHTML = "";

         for(let i = 0; i < arr.length; i++)
         {
         let span = document.createElement("span");
         span.innerText = arr[i];
         span.addEventListener("click", function() {
         alert(this.innerText);
         console.log(this.innerText);

         });

         div.appendChild(span);
         div.appendChild(document.createTextNode(" "));
         console.log("method_keywords");
         }

Here is the html output.

<div id="keywords" class="col-md-9">
                {{task.description}}
            </div>

And if I myself write my text in div (without using data from the database), then it is displayed and the method works correctly.

<div id="keywords" class="col-md-9">
               something text text text text text
            </div>

Is there a possibility to fix this?