这是我的问题。我想使用angularjs- requirejs延迟加载指令。以下是plunker http://plnkr.co/edit/HdQMxW5MbvmY49AMz4Le
中的示例如果你看,有3个js文件。主,应用程序和目录 即使加载了所有文件。包含该指令的dir不会被执行。
Main.js
require.config({
paths: {
'angular': 'http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js'
},
shim: {
'angular': {
'exports': 'angular'
}
}
});
require(['angular', 'app'], function (angular, app) {
console.log("Control Reaches Here. Step-1- main.js ");
require(['dir']);
console.log("Control Reaches Here. Step-2- main.js ");
angular.element().ready(function () {
angular.bootstrap(document, ['v2r']);
console.log("Control Reaches here. Step-3- main.js");
});
});
App.js
define('app', ['require', 'angular'], function (require, angular) {
console.log('This gets loaded - app.js');
return angular.module('v2r', []);
});
Dir.js
define('dir', ['require', 'angular', 'app'], function (require, angular, app) {
console.log('This gets loaded - dir.js');
app.directive('dir', function () {
console.log("Directive fired.");
return {
restrict: 'E',
replace: true,
template: '<h1>Hello World </h1>',
link: function (scope) {
console.log('directive Loaded');
}
};
});
return app;
});
我的index.html如下所示。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lazy Loading</title>
<script src="http://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.14/require.min.js" data-main="main" type="text/javascript"></script>
</head>
<body>
<dir />
</body>
</html>
下面给出的是日志
-------原木-----------------------
- 这会被加载 - app.js
- 控制到达此处。 Step-1- main.js
- 控制到达此处。 Step-2- main.js
- 控制到达此处。 Step-3- main.js
- 这会被加载 - dir.js
如果你看到上面的内容,dir只是加载,它没有被执行。有人可以告诉我这里我做错了吗?