我有一个使用 Onsen UI 和 AngularJS 构建的跨平台企业应用程序。然而,该应用程序的规模正在快速增长,并且变得令人困惑且难以管理。到目前为止,我已经能够在 1 个 app.js 文件中管理所有应用程序 Controller ,并且该应用程序运行良好。但我想将我的 Controller 分成不同的 .js 文件,例如登录.js、注册.js。随着应用程序的增长,使其更易于管理。
我找到了THIS SO(标记的答案)上的解决方案,但我在实现它时遇到了困难。同样,链接上 @jason328 的答案看起来非常优雅,但我再次陷入用我的代码实现它的困境。
在我的主要新 app.js 文件中,我的模块如下:
angular.module('myApp.controllers', ['onsen']);
然后在例如login.js 我设置我的模块如下:
angular.module('myApp.controllers').controller('LoginController', ['$scope', '$http', function($scope, $http)
{
// All the login logic goes here
}]);
这不起作用,因为没有显示任何页面。当我在原始 app.js 文件中进行此设置时,该应用程序运行完美(原始代码如下)。
var app = angular.module("myApp", ['onsen']);
// Manages the state of the login.html screen
app.controller("LoginController", function($scope, $http)
{
// All the login logic goes here
});
我的问题在于我认为新的 app.js 中的 ['onsen'] ?但是我如何将其包含在我尝试实现的SO解决方案中?
最佳答案
还有另一种方法可以做到这一点。您可以为每个文件创建一个模块并将它们添加到 myApp 模块中,如下所示:
app.js
var app = angular.module("myApp", ['onsen', 'loginControllers', 'otherController']);
登录.js
var login = angular.module("loginControllers", []);
login.controller("LoginController", function($scope, $http)
{
// All the login logic goes here
});
其他.js
var other = angular.module('otherControllers', []);
other("OtherController", function($scope, $http)
{
// All the other logic goes here
});
确保您已将所有脚本添加到您的index.html中。
关于javascript - 将 AngularJS Controller 拆分为多个文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37166086/