Listen to div inner Text changes

Okay so I have this div element

 <div id="pose-result" class="layer"></div>

I wanna listen and return the text of that div whenever there’s a change.
Here’s the .ts function

ngOnInit() {
    var result = document.getElementById('pose-result');
    result.addEventListener("DOMCharacterDataModified", function (event) {
    }, false);

I’ve tried that but It’s not working, any ideas?
I know that OnInit will trigger only once but I didn’t find any solution.

Question: How do you set the Text?

I’m setting the text from another js file.

const resultLayer = document.querySelector("#pose-result");
resultLayer.innerText = gestureStrings[];

Virtually every time I have typed the word “document” in an Angular app I’ve regretted it. I would suggest that a more idiomatic way to do all of this would be to use property bindings as outlined in the Tour of Heroes, chapter 3.


Thank you for your answer, can you give me an example how to do that on a div element?

The general concepts introduced in the Tour of Heroes should be applicable to div elements.

1 Like

lol. Ive been through the same pain.

1 Like

Well thanks for the answer but I found another solution. I changed the <div> element to <ion-input> and listened to the changes through (ionChange) event.