使用ocLazyLoad时注入到延迟加载的AngularJS Controller中

达努什·戈皮纳斯

我开始使用ocLazyload来延迟加载几个AngularJs控制器。我已经$routeProvider像这样使用它了

  $routeProvider.when("/login", {
        templateUrl: "login.html",
        resolve: {
            loadCtrl: ['$ocLazyLoad', function($ocLazyLoad) {
                return $ocLazyLoad.load('LoginCtrl.js');
            }]
        }
    }).

而且效果很好。

我有另一个路由定义,该路由定义使用resolve属性在加载控制器之前解析少量项目。

 when("/dashboard", {
        templateUrl: "dashboard.html",
        controller: "DashboardCtrl",
        resolve: {
            profileData: getProfile,
            count : getCount
        }
    }).

现在我也想懒加载这个控制器,我像这样尝试过

   when("/dashboard", {
        templateUrl: "dashboard.html",
        resolve: {
            profileData: getProfile,
            count : getCount,
            loadCtrl: ['$ocLazyLoad', function($ocLazyLoad) {
                return $ocLazyLoad.load(['DashboardCtrl.js']);
            }]
        }
    }).

在这种情况下,页面会加载,但是profileDatacount不会注入到控制器中。控制器定义如下。

var app = angular.module('gt');
app.controller('DashboardCtrl', ['$scope', '$rootScope', 'profileData', 'count',
    function($scope, $rootScope, profileData, count) {
...
}]);

在调试时,我意识到getProfileandgetCount方法将被调用,但是它异步发生,并且控制器也延迟加载而无需等待这些方法。如何同时注入和延迟加载?我可以使用诺言以任何方式解决此问题吗?

我正在使用AngularJS 1.3.10和ocLazyLoad 1.0.5版本

getProfile 参考功能

var getProfile = function($q, $http, Profile, localStorageService) {
        var deferred = $q.defer();
        if (!localStorageService.get("loggedInUser")) {
            $http.post('/loggedin').success(function(user) {
                if (user) {
                    localStorageService.set("loggedInUser", user.email)
                    Profile.get(localStorageService.get("loggedInUser"), function(profileData) {
                        if (profileData) {
                            deferred.resolve(profileData);
                        } else {
                            deferred.resolve();
                        }
                    });
                } else {
                    deferred.reject();
                }
            });
        } else {
            Profile.get(localStorageService.get("loggedInUser"), function(profileData) {
                if (profileData) {
                    deferred.resolve(profileData);
                } else {
                    deferred.resolve();
                }
            });
        }
        return deferred.promise;
    }

getProfile.$inject = ["$q", "$http", "Profile", "localStorageService"];
达努什·戈皮纳斯

我可以使用以下配置来工作 $routeProvider

when("/dashboard", {
    templateUrl: "dashboard.html",
    controller :"DashboardCtrl"
    resolve: {
        profileData: getProfile,
        count : getCount,
        loadCtrl: ['$ocLazyLoad', function($ocLazyLoad) {
            return $ocLazyLoad.load(['DashboardCtrl.js']);
        }]
    }
}).

DashboardCtrl控制器在哪里定义DashboardCtrl.js

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

模板中的AngularJS“ Controller as”

来自分类Dev

Angularjs中从Diretives到Controller的通信

来自分类Dev

在Controller AngularJS中创建函数

来自分类Dev

AngularJS注入Factory到Controller奇怪的错误

来自分类Dev

在angularjs中动态加载CSS(加载延迟)

来自分类Dev

Symfony 2依赖注入到Controller构造中

来自分类Dev

Grails根据环境将服务注入到Controller中

来自分类Dev

Symfony 2依赖注入到Controller构造中

来自分类Dev

无法在AngularJS中为局部视图注入Controller

来自分类Dev

在Controller中的Angularjs中访问URL参数

来自分类Dev

如何将AngularJS自定义指令注入到引导程序预加载的模态中?

来自分类Dev

延迟加载和$ ocLazyLoad

来自分类Dev

AngularJS在Controller中刷新数据的正确方法

来自分类Dev

angularjs中Controller和Directive之间的通信

来自分类Dev

在Controller中调用模态函数-AngularJS

来自分类Dev

在示例中的Controller中共享数据-AngularJs

来自分类Dev

在 Docker 中启动 Controller 时遇到的问题

来自分类Dev

将列表中的项目循环到 Controller 中的 ViewBag 中

来自分类Dev

CakePHP Controller继承中的“使用”-变量

来自分类Dev

如何使用Controller在Magento中创建产品?

来自分类Dev

如何使用Jasmine测试AngularJS Controller从Promise中返回的值?

来自分类Dev

外部文件中的AngularJs Controller和使用路由

来自分类Dev

无法使用Ninject将依赖项注入到从Angular Service调用的ASP.NET Web API Controller中

来自分类Dev

无法使用Ninject将依赖项注入到从Angular Service调用的ASP.NET Web API Controller中

来自分类Dev

如何在Laravel中调用端点时模拟注入Controller中的对象?

来自分类Dev

在Angular 6中使用延迟加载时,路由不适用于其他路由

来自分类Dev

在AngularJS中的ng-repeat中访问Controller变量

来自分类Dev

使用Websockets时无法在Spring Controller中获取会话

来自分类Dev

使用“ controller as”语法时,如何访问控制器中的“ this”?

Related 相关文章

  1. 1

    模板中的AngularJS“ Controller as”

  2. 2

    Angularjs中从Diretives到Controller的通信

  3. 3

    在Controller AngularJS中创建函数

  4. 4

    AngularJS注入Factory到Controller奇怪的错误

  5. 5

    在angularjs中动态加载CSS(加载延迟)

  6. 6

    Symfony 2依赖注入到Controller构造中

  7. 7

    Grails根据环境将服务注入到Controller中

  8. 8

    Symfony 2依赖注入到Controller构造中

  9. 9

    无法在AngularJS中为局部视图注入Controller

  10. 10

    在Controller中的Angularjs中访问URL参数

  11. 11

    如何将AngularJS自定义指令注入到引导程序预加载的模态中?

  12. 12

    延迟加载和$ ocLazyLoad

  13. 13

    AngularJS在Controller中刷新数据的正确方法

  14. 14

    angularjs中Controller和Directive之间的通信

  15. 15

    在Controller中调用模态函数-AngularJS

  16. 16

    在示例中的Controller中共享数据-AngularJs

  17. 17

    在 Docker 中启动 Controller 时遇到的问题

  18. 18

    将列表中的项目循环到 Controller 中的 ViewBag 中

  19. 19

    CakePHP Controller继承中的“使用”-变量

  20. 20

    如何使用Controller在Magento中创建产品?

  21. 21

    如何使用Jasmine测试AngularJS Controller从Promise中返回的值?

  22. 22

    外部文件中的AngularJs Controller和使用路由

  23. 23

    无法使用Ninject将依赖项注入到从Angular Service调用的ASP.NET Web API Controller中

  24. 24

    无法使用Ninject将依赖项注入到从Angular Service调用的ASP.NET Web API Controller中

  25. 25

    如何在Laravel中调用端点时模拟注入Controller中的对象?

  26. 26

    在Angular 6中使用延迟加载时,路由不适用于其他路由

  27. 27

    在AngularJS中的ng-repeat中访问Controller变量

  28. 28

    使用Websockets时无法在Spring Controller中获取会话

  29. 29

    使用“ controller as”语法时,如何访问控制器中的“ this”?

热门标签

归档