AngularJS 动态引导或加载控制器答案

【问题标题】：AngularJS bootstrap or load controllers on the flyAngularJS 动态引导或加载控制器
【发布时间】：2016-07-22 07:23:56
【问题描述】：

我认为这个问题的答案是“不”，但我还是要问这个问题，因为我似乎找不到明确的答案。

angularjs 可以动态加载控制器吗？

为了进一步解释，我有一个通过 ng-app.Example、index.html 文件以默认方式引导的 Angular 应用程序：

<!doctype html>
<html>
<head>
    <title>myapp</title>
</head>
<body ng-app="app">
...
<app-body></app-body>
<script src="lib/angular/angular.min.js"></script>
<script src="app/app.js"></script>
...

在 app 模块中，我有一个路由设置，如下所示：

$routeProvider
          .when('/Home', {
              templateUrl: 'home/home.html',
              controller: 'HomeController'
          })
          .when('/Behaviors', {
              templateUrl: 'contact/contact.html',
              controller: 'ContactController'
          });
        // etc.

我很好奇 - 当用户转到该路径时，有没有办法加载 HomeController.js 文件？这样那个js文件就没有设置在上面的index.html中，而是在home/home.html里面：

<script src="home/HomeController.js"></script>

这样的事情可能吗？

【问题讨论】：

标签： angularjs angular-bootstrap

【解决方案1】：

是的，AngularJS 能够动态加载路由控制器和依赖项，例如工厂。它需要使用 RequireJS。 RequireJS 将是您的入口点，它将加载 Angular。

角度路由的解析属性将启动对通过 RequireJS 解析文件的某些代码的调用。由于 resolve 属性使用了 Promise，所以在文件加载之前不会加载路由。

或者，您可以使用 GulpJS、Gulp-angular-template cache、concat、uglify 等优化应用程序。下面是一个示例：

http://weblogs.asp.net/dwahlin/dynamically-loading-controllers-and-views-with-angularjs-and-requirejs

【讨论】：