如何在angularjs中拆分多个js文件中的单个控制器[关闭]答案

【问题标题】：How to split single controller in multiple js files in angularjs [closed]如何在angularjs中拆分多个js文件中的单个控制器[关闭]
【发布时间】：2014-09-13 03:56:58
【问题描述】：

我正在重写一个从 silver-light 到 angularjs 的大型应用程序，在执行此操作时，我意识到我的每个控制器 js 文件跨越 2000-3000 行代码。我所有的代码都严重依赖于 scope 变量。想知道是否有机会将单个控制器 js 文件拆分为多个 js 文件？任何指针将不胜感激。

【问题讨论】：

服务和工厂应该是你的朋友。您还提到事情依赖于很多范围变量。如果某些东西没有绑定到 DOM，我尽量不要把它挂在范围之外
Pramod，虽然是跨越2-3K，但代码是模块化的；然而，单个文件中的 2-3K javascript 变得难以维护，因此是个问题。如果有办法将控制器拆分为多个文件并共享范围，请告诉我。

标签： angularjs controllers

【解决方案1】：

使用多个控制器来处理页面中的任务。如果使用大型控制器是不可避免的，您可以通过将范围传递给另一个方法来将定义拆分为多个文件，然后在那里定义其余方法。

在第一个文件中：

app.controller('CtrlA', function($scope){
app.expandControllerA($scope);

});

在第二个文件中

app.expandControllerA = function($scope)
{

}

您可以将任何变量或依赖项传递给 expandControllerA 函数。

【讨论】：

第二个文件应该在第一个之前加载。 app 也应该在第二个文件中定义

【解决方案2】：

您也可以创建基础控制器并使用$controller 服务创建派生控制器。

例如：

function BaseCtrl($scope, options) {
    var vm = this;

    // code
    return vm;
}

function ChildCtrl($controller, $scope) {
    var vm = $controller('BaseCtrl', {
        $scope: $scope,
        options: { }
    });

    // extend view model
    vm.name = '';

    return vm
}

还有其他方法可以将控制器拆分为单独的文件，请查看此 ng-conf video。

【讨论】：

【解决方案3】：

您可以在 Angular 模块中使用 App.factory 或 app.service， 它们更像是在您的 sn-p 中继承数据。这样您就可以在主控制器之外分配部分数据，并在您的控制器中继承分配的变量。

    app.factory('name of the factory',function(){
return (data)
   )
app.controller('$scope','name of the factory', function(scope, name of the factopry

$scope.new = data;
))

【讨论】：