Question

这个问题有点奇怪，可能很难掌握，但我会尽力解释。我不得不使用AngularJS重写移动应用程序，因为之前的版本不是真正的SPA。这是一个JSP网站，其风格适合使用ajax来调用灯箱，视图等的移动设备。现在我必须为新的AngularJS应用程序创建新功能，并将其包含在之前的JSP版本中（angularJS版本）尚未发布）。我不想两次这样做，所以我将AngularJS添加到旧版本中。我在body标签上注册了一个应用程序，注册了一些控制器，除了一件事以外一切都很好。我的app.js文件中包含以下内容。

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
});

现在，当原始视图加载MainCtrl和UploadCtrl已在HTML中注册时，但是ProfileCtrl未注册，因为这是由灯箱提供的内容，后者是动态加载的用户事件（单击）。当灯箱打开时，我在我的HTML中注册data-ng-controller="ProfileCtrl"没有注册任何内容，没有任何内容写入控制台，Controller无法正常工作。我尝试通过向灯箱HTML添加脚本标签来注册这个，如此

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

但没有任何反应。当灯箱被提升/调用时，如何让我的模块注册ProfileCtrl？

如果我没有解释清楚，请告诉我，我将添加到我的描述中。

提前致谢

Answer 1

开箱即用，Angular不能懒得加载它的＆＃34;文物＆＃34; （控制器，指令等）。您在引导后注册的任何内容都被接受，这意味着不会抛出任何错误，但是依赖注入框架会默默地忽略它。

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

懒惰地注册控制器的步骤大致如下：

从$controllerProvider块中捕获config：

var app = angular.module('app',[...]);
var cachedControllerProvider;

app.config(function($controllerProvider) {
    cachedControllerProvider = $controllerProvider;
});

（全球并不漂亮，但这只能说明原则。）

使用cachedControllerProvider懒惰注册控制器 ;不要改变普通控制器的注册方式：
```
cachedControllerProvider.register('ProfileCtrl', function ($scope) {
    console.log('ProfileCtrl');
});
```
（在angular-require-lazy中我修改angular对象以透明地处理这个问题;这也是你的选择。）
确保在使用这些控制器的模板之前，执行包含惰性控制器注册的任何脚本！

无需路由即可动态添加/注册AngularJS控制器

1 个答案: