如何在AngularJS中绑定<script>元素的src属性

Question

我试图将srcHTML <script>元素的属性绑定到我的角度控制器中的变量,以便我可以从控制器更新它而无需处理任何UI.

到目前为止,我已经尝试了所有这些选项:

<script type="text/javascript" ng-src="{{sourceUrl}}"></script>
<script type="text/javascript" src="{{sourceUrl}}"></script>
<script type="text/javascript" ng-src="sourceUrl"></script>

在我的控制器中我有:

$scope.sourceUrl = "https://<some url goes here>";

在$ scope.sourceUrl设置后在浏览器中运行页面时,没有对sourceUrl的传出请求,所以我确信我做错了.有任何想法吗？

我发现了几篇关于元素src属性的帖子<img>,ng-src应该像他们说的那样工作,但我猜<script>不同.

Answer 1

不幸的是,你不能以这种方式使用Angular.只有在加载和构建页面之后,Angular才会对网页<script>进行处理,这时标签已被处理一次(脚本标记只运行一次).其他标签,如img在页面加载后属性发生变化时会改变屏幕的视觉外观......但如上所述,脚本只处理一次,甚至在页面加载期间和Angular可以获得控制之前.

Answer 2

您可以在控制器内动态地将其添加到正文的末尾:

        $("<script>").attr({src: $scope.sourceUrl}).appendTo("body");