javascript - 如何使用angularJS动态地将脚本添加到index.html？

Question

我有2个html文件(a.html和index.html)和1个javascript文件(file.js)在a.html中------我有一个不同语言的下拉菜单(比如英语) 、德语、印地语)。从下拉列表中选择一种语言。

 <select ng-model="lang" class="form-control input-custom input-sm" ng-change="language(lang)" required>
        <option value="" selected>--Choose language--</option>
        <option value="en-us">english</option>
        <option value="id-id">indonesia</option>
 </select>

file.js---根据从.html文件中选择的语言，我更新了index.html文件。

$scope.language=function(lang){
  var search_quarry = "bower_components/angular-i18n/angular-locale_" + lang + ".js";
  var scr = document.createElement("script");
  scr.src = search_quarry;
  document.getElementsByTagName("body")[0].appendChild(scr);
  console.log(document);
}

在 file.js 中，如果我执行 console.log(document)...它表明脚本标记附加在 index.html 的正文中。但当我选择语言时，结果没有反射(reflect)。

用于附加到index.html的脚本标记

<script src="bower_components/angular-i18n/angular-locale_id-id.js"></script>

index.html----- 如果我在index.html中手动附加脚本标签，则会显示结果，但是当我动态更新它时..脚本标签会附加到index.html文件，但结果不会反射(reflect)。如何重新加载index.html，以便在运行应用程序时也反射(reflect)动态添加的内容？

Answer 1

尝试使用setAttribute()而不是直接赋值，更改:

scr.src = search_quarry;

至

scr.setAttribute('src', search_quarry);