AngularJS 加载到单独文件中的控制器中答案

【问题标题】：AngularJS load in controllers that are in separate filesAngularJS 加载到单独文件中的控制器中
【发布时间】：2014-07-30 23:27:58
【问题描述】：

app.config(function($routeProvider) {
        $routeProvider

            // route for the home page
            .when('/demo', {
                templateUrl : 'assets/pages/home.html'
            })

            // route for the sport page
            .when('/sport', {
                templateUrl : 'assets/pages/sport/home.html',
                controller  : 'sportController'
            });

            // route for the sport page
            .when('/television', {
                templateUrl : 'assets/pages/television/home.html',
                controller  : 'televisionController'
            });
});

我在名为SportCtrl.js 的文件中有sportController，在名为TvCtrl.js 的文件中有televisionController，如何在使用路由时将其加载到我的视图中？

【问题讨论】：

奇怪的问题。只需将这些脚本包含到 HTML 中，剩下的就交给 Angular。
@dfsq 我试图保持它的 html 端干净，并确定有一种方法可以动态加载 js
嗯，你当然可以使用 RequireJS 之类的东西。或者你可以包含所有的脚本，然后用 Grunt 设置构建过程。

标签： angularjs angularjs-scope angularjs-routing angularjs-controller

【解决方案1】：

您正在尝试延迟加载 javascript 文件。这不是 Angular 功能，您有 3 个解决方案：

使用 requireJs 即时加载文件。
在 html 中包含所有 javascript 文件
将所有 javascript 文件连接到一个文件中。

我不喜欢使用 requireJS 来防止再次包含和配置:-)

【讨论】：

【解决方案2】：

您应该正确地将控制器添加到 app 命名空间中，Angular 会自己完成所有事情。

例如，项目的工作结构：

加载 Angular、依赖项。
加载您的应用程序初始化程序、配置。
加载其他内容，如控制器、指令、服务、过滤器。

控制器代码示例：

app.controller('sportController', ['$scope', function($scope){

}])

顺便说一句，Angular 文件名没有任何意义。

【讨论】：