如何使用自定义角度指令加载脚本

How to load a script using custom angular directive?

本文关键字：指令 加载 脚本 何使用 自定义      更新时间：2023-09-26

我正在尝试在我的自定义角度指令中加载脚本。现在，它只是在 DOM 中添加脚本标签，但没有加载它。 

angular.module('myApp')
  .directive('rjHeader', function () {
    return {
      restrict: 'E',
       template : function(e,a){
           return '<script type="text/javascript" charset="utf-8" src="https://my.web.com/path/' + a.locale + '/some.js" ></script>';  
        }
    };
  });

并在 html 中

<div rj-Header locale="en_US"></div>

在浏览器中打开页面时，它会正确添加所需的脚本。 

<script type="text/javascript" charset="utf-8" src="https://my.web.com/path/en_US/some.js" ></script>

但这实际上并没有加载这个.js文件。如果我简单地将此行复制粘贴到我的 html 中，那么它会按预期工作。如何使用自定义角度指令注入脚本？

这里似乎有点不对劲，但如果你真的想这样做，你可以将脚本标签附加到指令的元素中：

app.directive('loadDirective', function() {
  return {
    restrict: 'E',
    link: function($scope, $el) {
      var script = document.createElement('script');
      script.src = '//cdnjs.cloudflare.com/ajax/libs/emojione/1.3.0/lib/js/emojione.min.js'
      $el.append(script);
    }
  }
});

普伦克

相关文章：