加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

AngularJS动态加载控制器

发布时间:2020-12-17 07:45:43 所属栏目:安全 来源:网络整理
导读:我读了很多关于lazzy加载,但是我使用$routeProvider时面临一个问题. 我的目标是加载一个包含控制器的javascript文件,并向之前加载的控制器添加路由. 要加载我的javascript文件的内容 angular.module('demoApp.modules').controller('MouseTestCtrlA',['$scop
我读了很多关于lazzy加载,但是我使用$routeProvider时面临一个问题.

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

要加载我的javascript文件的内容

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

当调用角度引导程序时,不包括此文件.这意味着,我必须加载文件并创建一个到该控制器的路由.

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

‘MouseTestCtrlA’ is not a function,got undefined

这是我试图设置的电话:

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

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

controller – {(string|function()=} – Controller fn that should be associated with newly created scope or the name of a registered controller if passed as a string.

所以我写了一个工厂,应该可以加载我的文件,然后(承诺样式!)我应该尝试声明一个新的路由.

它给了我下面的东西,其中依赖关系是一组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();
                    });
                });
                return deferred.promise;
            }
        }
    }]);

问题

我仍然有这个javascript错误“’MouseTestCtrlA’不是一个功能,未定义”这意味着Angular无法解析为“注册控制器”的MouseTestCtrlA.

有人可以帮我吗?

重新阅读本文 http://ify.io/lazy-loading-in-angularjs/建议在Angular App中保留$contentProvider实例.

我在我的app.js中提出了这个代码

demoApp.config(function ($controllerProvider) {
     demoApp.controller = $controllerProvider.register;
});

它使我能够按照预期在外部的javascript文件中编写我的控制器:

angular.module("demoApp").controller('MouseTestCtrlA',fn);

希望这可以帮助!

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读