title: Integrating tawk.to into Angular 6 (Angular 2) app
body: <p>I'd like to integrate tawk.to chat into my Angular 6 website. </p>
  
  <p>Tawk.to provides the following code:</p>
  
  <pre><code>&lt;!--Start of Tawk.to Script--&gt; 
  &lt;script type="text/javascript"&gt; var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date(); (function(){ var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0]; s1.async=true; s1.src='https://embed.tawk.to/17f35g40afc2c34e96e75909/default'; s1.charset='UTF-8'; s1.setAttribute('crossorigin','*'); s0.parentNode.insertBefore(s1,s0); })(); &lt;/script&gt; 
  &lt;!--End of Tawk.to Script--&gt;
  </code></pre>
  
  <p>The code basically creates divs in my page:</p>
  
  <p><a href="https://i.stack.imgur.com/p2fUp.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/p2fUp.jpg" alt="enter image description here"></a></p>
  
  <p>But naturally when I navigate to another route the html widget gets destroyed. </p>
  
  <p>I'm thinking of using a service for fetching the external script and a component for displaying the widget. But I'm not sure how well it is going to work.</p>
  
  <p>What's the best approach to integrate tawk.to live chat into an angular app ?</p>