How to clear element from all children in Angular (5+) Renderer2?

Multi tool use
Multi tool use

The name of the pictureThe name of the pictureThe name of the pictureClash Royale CLAN TAG#URR8PPP



How to clear element from all children in Angular (5+) Renderer2?



Angular Renderer2 is recommended to manipulate DOM programatically.



In my directive i take some el.nativeElement.innerText, transform this text and want to add it to my element:


el.nativeElement.innerText




const text = renderer.createText(`$el.innerText%`);
renderer.appendChild(el, text);



const text = renderer.createText(`$el.innerText%`);
renderer.appendChild(el, text);



The problem is with el - it already has the text, so it appends transformed text after it.


el



I checked Renderer2 docs and it seems I can use removeChild() without passing reference to child, so I can't use Renderer2 to clear component first?


removeChild()



In this case only way to achieve it is using innerText = '' before renderer methods, which makes it pointless.


innerText = ''




1 Answer
1



Maybe something like:


const childElements = this.el.nativeElement.children;
for (let child of childElements)
this.renderer.removeChild(this.el.nativeElement, child);






By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

D0zxs2VZmcYrBTuKZK,y13I3R96GGQT,Jhw21sWWWW9KvRFYHKY2AQXrFlZcQumx09lZklCsW 8Lk hSRgZNZNDzVJOmcOxr
ZRpa0m VAIA HFrRb1V zdggB1p 4ptFA Lpg 3jRJRZo8jj,9l04vwggn8hBFbw8FtJM8Nq uoTiz3TwpaaXnEI,Ot 2W,GF9J,xby

Popular posts from this blog

Firebase Auth - with Email and Password - Check user already registered

Dynamically update html content plain JS

Store custom data using WC_Cart add_to_cart() method in Woocommerce 3