2015-02-24 73 views
0

这个问题有点奇怪,可能很难把握,但我会尽量解释我可以。由于以前的版本不是真正的SPA,我不得不使用AngularJS来重写移动应用程序。这是一个JSP网站,它的样式适合使用ajax调用Lightbox,视图等的移动设备。现在,我必须为新的AngularJS应用程序创建新功能,并将其包含到以前的JSP版本中(angularJS版本尚未发布)。我不想这样做两次,所以我已经将AngularJS添加到旧版本。我在身上的标签上注册了一个应用程序,注册了一些控制器,除了一件事以外,一切都很好。我在我的app.js文件中有以下内容。动态添加/注册一个AngularJS控制器没有路由

var oldMobile = angular.module('oldMobile', [ 
     'flow' 
]) 

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

.controller('MainCtrl', function ($scope) { 
    console.log('MainCtrl'); // this is shown in the console 
}) 

.controller('UploadCtrl', function ($scope) { 
    console.log('UploadCtrl'); // this is shown in the console 
}) 

.controller('ProfileCtrl', function ($scope) { 
    console.log('ProfileCtrl'); // this is NOT shown in the console 
}); 

现在,当原始视图负荷MainCtrlUploadCtrl注册为他们的HTML内,但ProfileCtrl未注册,因为这是由被用户事件后,动态加载(灯箱点击提供的内容)。当我在HTML中注册了data-ng-controller="ProfileCtrl"之后,没有任何内容被写入控制台时,控制器无法正常工作。我试图通过添加一个脚本标记到灯箱HTML注册这样的

<script> 
    angular.module("oldMobile").controller('ProfileCtrl'); 
</script> 

但没有任何反应。如何让我的模块在Lightbox被调用时注册ProfileCtrl?

如果我没有解释清楚,请让我知道,我会加上我的描述。

预先感谢

回答

1

开箱,角不能延迟加载其“伪影”(控制器,指令等)。引导后注册的任何东西都被接受,这意味着不会抛出任何错误,但会被依赖注入框架默默忽略。

该解决方案有点复杂,首先看到它here并在angular-require-lazy中实现它,以便使用RequireJS进行延迟​​加载。

用于登记控制器步骤懒惰地是大致如下:

  1. 捕获的$controllerProviderconfig块:

    var app = angular.module('app',[...]); 
    var cachedControllerProvider; 
    
    app.config(function($controllerProvider) { 
        cachedControllerProvider = $controllerProvider; 
    }); 
    

    (全球是不漂亮,但是这仅演示原理)

  2. 使用cachedControllerProvider注册控制器懒洋洋;不改变正常的控制器登记方式:

    cachedControllerProvider.register('ProfileCtrl', function ($scope) { 
        console.log('ProfileCtrl'); 
    }); 
    

    (在角需要懒我修改angular对象透明地处理这个问题,这是一个选择了。)

  3. 确保任何包含懒惰控制器注册的脚本都会在使用这些控制器的模板之前执行