使用 AngularJS 路由和使用 requirejs 按需加载控制器答案

【问题标题】：Using AngularJS routing and loading controllers on demand using requirejs使用 AngularJS 路由和使用 requirejs 按需加载控制器
【发布时间】：2016-02-24 16:13:21
【问题描述】：

我正在尝试结合使用 AngularJS 和 RequireJS。我想使用$routeProvider 服务，避免在应用程序启动时为我的视图加载所有控制器。为此，我尝试了以下方法：

define(['require', 'angular', 'appModule'], function (require, angular, app) {
    app.config(['$routeProvider', function($routeProvider) {
      $routeProvider
          .when('/sites', {templateUrl: '/Site/GetSitesView', controller: function() {
            require(['sitesController'], function(SitesController) {
                return new SitesController();
            })
        }})
    }]);
});

不幸的是，这对我不起作用。没有错误。包含控制器的 JS 文件正在正确加载，但我在渲染视图中看不到数据绑定值。我想知道是否可以通过其他方式分配 controller 的值，以等待异步调用（加载 JS 文件）完成。

有什么想法吗？

【问题讨论】：

唯一的办法就是获取$controllerProvider。我在这里有一个可行的解决方案：github.com/matys84pl/angularjs-requirejs-lazy-controllers
@matys84pl 这实际上符合我的想法。谢谢你分享这个。不过有一件事，我浏览了代码，发现您正在使用 Require Text 插件加载模板，这是使用您的库加载模板的唯一支持方式吗？如果我想从服务器上的 URL 加载模板怎么办？
这取决于 url 是否与您的应用程序相关。换句话说，它是否在同一个域中？如果不是，那么我认为您将不得不使用某种代理来实现这一点（从其他域加载文件）。
感谢 matys84pl。这真的很有帮助。只是想知道为什么您的回复没有被标记为答案（Kassem）？
@matys84pl 我们也可以用它来加载服务吗？

标签： routing angularjs requirejs

【解决方案1】：

您可以找到解决方案here

您需要在每个路由上定义一个解析属性，并为其分配一个返回承诺的函数。该函数可以动态加载包含目标控制器的脚本，并在加载完成后解析promise。在这个article 中，Dan Wahlin 展示了如何使用约定优于配置来获得更实用的路由。

【讨论】：

感谢您的帖子。帮了我很多！