gpt4 book ai didi

javascript - 多次意外加载 angularjs 会导致奇怪的行为

转载 作者:行者123 更新时间:2023-11-28 01:41:34 25 4
gpt4 key购买 nike

由于动态加载 Angular.js 实例,我发现 ng-repeat 会立方显示的项目数的问题。

以下代码演示了该问题:

<html ng-app="brokentable">
<head>
<title>Broken Angular Table</title>

<!-- the following are dynamically added by other code -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js"></script>

<script type="text/javascript">
var app = angular.module('brokentable', []);

app.controller('BrokenTable', function($scope) {
$scope.headings = ['One', 'Two', 'Three'];
$scope.fillings = [[1, 2, 3], ['A', 'B', 'C'], [7, 8, 9]];
});
</script>
</head>
<body ng-controller="BrokenTable">
<table>
<tr>
<th ng-repeat="heading in headings">{{heading}}</th>
</tr>
<tr ng-repeat="filling in fillings">
<td ng-repeat="fill in filling">{{fill}}</td>
</tr>
</table>
</body>
</html>

如何防止 Angular 的 JS 文件被多次加载,但仍然能够动态添加脚本引用到页面?

鉴于我仍然需要动态添加脚本文件引用到我的页面,我可以采取什么措施来防止上述问题发生?

最佳答案

可以使用 window.angular 包装 angularjs 的加载代码,如下所示:

  <script>
if (!window.angular) {
document.write('<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js"><\/script>');
}
</script>

或者如果您碰巧使用的是 Angular 的本地副本:

  <script>
if (!window.angular) {
document.write('<script src="angular.js"><\/script>');
}
</script>

这样您就可以避免无意中加载两次 Angular ,从而导致意外且无声的副作用。

关于javascript - 多次意外加载 angularjs 会导致奇怪的行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20863181/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com