小编t00*_*00f的帖子

我读了很多关于lazzy loading的内容,但是在使用$ routeProvider时我遇到了一个问题.

我的目标是加载一个包含控制器的javascript文件,并添加一个先前已加载的控制器的路由.

我要加载的javascript文件的内容

angular.module('demoApp.modules').controller('MouseTestCtrlA', ['$scope', function ($scope) {
    console.log("MouseTestCtrlA");
    $scope.name = "MouseTestCtrlA";
}]);

调用angular bootstap时不包含此文件.这意味着,我必须加载文件并创建到该控制器的路由.

首先,我开始编写一个必须加载Javascript文件的resolve函数.但是在路由声明中声明我的控制器参数给了我一个错误:

'MouseTestCtrlA'不是函数,未定义

这是我要设置的电话:

demoApp.routeProvider.when(module.action, {templateUrl: module.template, controller: module.controller, resolve : {deps: function() /*load JS file*/} });

从我读到的,控制器参数应该是一个注册的控制器

controller - {(string | function()=} - 如果作为字符串传递,则应与新创建的作用域或已注册控制器的名称相关联的控制器fn.

所以我写了一个工厂,应该能够加载我的文件,然后(承诺风格!)我试图宣布一个新的路线.

它给了我类似下面的东西,其中依赖是一个javascript文件的加载路径数组:

用法

ScriptLoader.load(module.dependencies).then(function () {
    demoApp.routeProvider.when(module.action, {templateUrl: 'my-template', controller: module.controller});
});

脚本加载器

angular.module('demoApp.services').factory('ScriptLoader', ['$q', '$rootScope', function ($q, $rootScope) {
        return {
            load: function (dependencies)
            {
                var deferred = $q.defer();
                require(dependencies, function () {
                    $rootScope.$apply(function () {
                        deferred.resolve();
                    }); …