title: How to load a script using custom angular directive?
body: <p>I am trying to load a script in my custom angular directive. Right now, it is simply adding script tag in DOM but it is not loading it.  </p>
  
  <pre><code>angular.module('myApp')
    .directive('rjHeader', function () {
      return {
        restrict: 'E',
         template : function(e,a){
             return '&lt;script type="text/javascript" charset="utf-8" src="https://my.web.com/path/' + a.locale + '/some.js" &gt;&lt;/script&gt;';  
          }
      };
    });
  </code></pre>
  
  <hr>
  
  <p>And in html</p>
  
  <pre><code>&lt;div rj-Header locale="en_US"&gt;&lt;/div&gt;
  </code></pre>
  
  <hr>
  
  <p>When opening the page in browser, it correctly adds the intended script.  </p>
  
  <pre><code>&lt;script type="text/javascript" charset="utf-8" src="https://my.web.com/path/en_US/some.js" &gt;&lt;/script&gt; 
  </code></pre>
  
  <p>But this doesn't actually loads this .js file. If I simple copy paste this line to my html then it works as expected. How can I inject script using custom angular directive?</p>