angularjs - 如何为 AngularJS 编写自定义模块？

Question

我需要为 AngularJS 编写一个自定义模块，但我找不到关于该主题的任何好的文档。如何为 AngularJS 编写一个可以与他人共享的自定义模块？

Answer 1

在这些情况下，如果您认为文档无法再帮助您，一个非常好的学习方法是查看其他已经构建的模块，看看其他人是如何做到的，他们如何设计架构以及他们如何将它们集成到他们的应用程序。
看了别人做了什么，你至少应该有一个起点。

例如，查看任何Angular ui 模块，您会看到许多自定义模块。
一些只定义一个指令，而另一些定义更多的东西。

就像@nXqd所说，创建模块的基本方法是：

// 1. define the module and the other module dependencies (if any)
angular.module('myModuleName', ['dependency1', 'dependency2'])

// 2. set a constant
    .constant('MODULE_VERSION', '0.0.3')

// 3. maybe set some defaults
    .value('defaults', {
        foo: 'bar'
    })

// 4. define a module component
    .factory('factoryName', function() {/* stuff here */})

// 5. define another module component
    .directive('directiveName', function() {/* stuff here */})
;// and so on

定义模块后，很容易向其中添加组件（无需将模块存储在变量中）：

// add a new component to your module 
angular.module('myModuleName').controller('controllerName', function() {
    /* more stuff here */
});

集成部分相当简单：只需将其添加为您的应用程序模块的依赖项（这是angular ui 的操作方式）。

angular.module('myApp', ['myModuleName']);

Answer 2

如果你想找一个好的例子，你应该看看当前用 angularJS 编写的模块。学习阅读他们的源代码。顺便说一句，这是我用来在 angularJS 中编写模块的结构：

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

// in your app.js, include the module

这是基本的。

Answer 3

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

newMod.controller('newCon', ['$scope', function ($scope) {
    alert("I am in newCon");
    $scope.gr = "Hello";
}]);

这里的 newMod 是一个没有依赖项 [] 的模块，它有一个控制器，它有一个警告，告诉你在控制器中，还有一个值为 hello 的变量。