gpt4 book ai didi

javascript - Angularjs 不会在 ng-view 中加载脚本

转载 作者:IT王子 更新时间:2023-10-29 03:03:40 25 4
gpt4 key购买 nike

我有一些特定于 View 的脚本。但是,当 angularjs 加载 View 时,脚本似乎没有执行。

Index.html

<html>
<body ng-app="adminApp">

<div ng-view=""></div>

<script src="bower_components/angular/angular.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/controllers/main.js"></script>

</body>
</html>

Main.html - 在 ng-view 下加载

hello world
<script>

alert('Hello, John!')

</script>

在这个例子中,当页面加载时,我看到网站上打印了一个基本的 hello world。但是,我没有看到任何弹出窗口说“你好,约翰”。

知道为什么我无法加载特定 View 的脚本吗?


额外信息app.js

'use strict';

angular.module('adminApp', [])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.otherwise({
redirectTo: '/'
});
});

controllers/main.js

'use strict';

angular.module('adminApp')
.controller('MainCtrl', function ($scope) {
$scope.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
});

最佳答案

这就是 jqLit​​e 的工作方式。如果您希望评估模板中的脚本,请在 AngularJS 之前包含 jQuery。如果包含 jQuery,将评估脚本。尝试删除 jQuery,您会看到最初观察到的行为。

更新:由于有人在评论中要求详细说明,这里是:

当路由匹配时,ngView 使用 jqLit​​e(或 jQuery,如果已加载)html() 方法来设置元素的内容(第一个 ngView 声明于)。换句话说,ngView.link() 做了这样的事情:

$element.html(template)

所以归结起来就是html()在jqLit​​e和jQuery中是如何实现的。 jqLit​​e 使用原生的 innerHTML 属性,它只设置内容而不评估脚本。另一方面,jQuery 解析所有脚本标记并执行它们(通过构建脚本 DOM 元素并将其附加到页面)。

关于javascript - Angularjs 不会在 ng-view 中加载脚本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18220197/

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