角JS分离在不同的JS文件不同的模块 [英] Angular js seperation to different modules in different js files

问题描述

我创建了一个角的Web应用程序，使拖拽元素。

我完成建设，但我有一个很大的模块。该模块被放置在一个js文件与code线万。

我想知道我可以在相互通信的几个js文件分开我的大模块几个模块。

可能有人为我提供简单的例子，我该怎么办呢？

解决方案

  

我想知道我可以在相互通信的几个js文件分开我的大模块几个模块。

当然你可以用几个模块，并绑定他们像在下面的例子：

  VAR firstModule = angular.module（'firstModule'，[]）;
变种secondModule = angular.module（'secondModule'，['firstModule']）;
 

现在在 firstModule 创建的所有服务/指令是可见的 secondModule 。

但你创建两个模块之前，你应该问自己：

1。两个模块

多个模块，因为我所知道的是很好的方法，如果你的项目有不同的依赖不同的部分。

例如一个模块使用 ui.bootstrap 其他时候是空的，如：

  VAR firstModule = angular.module（'firstModule'，[]）;
变种secondModule = angular.module（'secondModule'，['ui.bootstrap'，'firstModule']）;
 

2。两个控制器

多重控制器的方法是很好的分割业务逻辑，使code更清晰。

3。两个js文件一个控制器

您想实现这种方式（因为我们不知道你的项目目标）

例如：

controllers.js

  VAR应用= angular.module（'对myApp'，[]）;app.controller（'someCtrl'，函数（$范围）{     //调用其它js文件：
     otherFile（$范围内）;    /*....*/
}）;
。应用$注射='$范围'];
 

someotherfile.js

  VAR otherFile =功能（$范围）{
/*...*/
}）;
 

I created an angular web application that enables drag and drop elements.

I finish building it, but i have one big module. The module is placed in one js file with thousand of code lines.

I would like to know how can i separate my big modules to several modules in several js files that communicate with each other.

May someone provide me simple example how can i do it?

解决方案

I would like to know how can i separate my big modules to several modules in several js files that communicate with each other.

Sure you can use several modules and bind them like in following example:

var firstModule = angular.module('firstModule', []);
var secondModule = angular.module('secondModule', ['firstModule']);

Now all services/directives created in firstModule are visible in secondModule.

But before you create two modules you should ask yourself:

1. two modules

Multiple modules as I know is good way if your project has different sections with different dependencies.

For example one module uses ui.bootstrap when other is empty, like:

var firstModule = angular.module('firstModule', []);
var secondModule = angular.module('secondModule', ['ui.bootstrap','firstModule']);

2. two controllers

The multiple controller approach is good to split business logic and make code clearer

3. one controller in two js files

You would want to implement this way (since we don't know your project goals)

For example:

controllers.js

var app = angular.module('myApp', []);

app.controller('someCtrl', function($scope) {

     // call other js file:
     otherFile($scope);

    /*....*/
});
app.$inject = ['$scope'];

someotherfile.js

var otherFile = function($scope) {
/*...*/
});

这篇关于角JS分离在不同的JS文件不同的模块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！