Angularjs-Requirejs指令没有被解雇

时间:2014-08-14 04:29:58

标签: angularjs angularjs-directive requirejs lazy-loading

这是我的问题。我想使用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只是加载,它没有被执行。有人可以告诉我这里我做错了吗?

0 个答案:

没有答案