Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I write a custom module for AngularJS?

Tags:

angularjs

I need to write a custom module for AngularJS, but I can't find any good documentation on the subject. How do I write a custom module for AngularJS that I can share with others?

like image 264
San Jay Falcon Avatar asked Oct 01 '13 06:10

San Jay Falcon


People also ask

How do you create a module in AngularJS?

var app = angular. module("myApp", []); The [] parameter in the module definition can be used to define dependent modules.

Can we create custom module in Angular?

So here we can see a folder with the module name has been created and a file called payroll. module. ts file has been created.

Which is the correct syntax of creating AngularJS application module?

13) Which of the following syntax is used to create a module in AngularJS? Answer: C is the correct option. To create a module in AngularJS, we use angular. module("app", []); syntax.


1 Answers

In these situations were you think that the docs can't help you any more, a very good way to learn is to look at other already-build modules and see how others did it, how they designed the architecture and how they integrated them in their app.
After looking at what others did, you should have at least a starting point.

For example, take a look at any angular ui module and you will see many custom modules.
Some define just a single directive, while others define more stuff.

Like @nXqd said, the basic way to create a module is:

// 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 

After defining your module, it's very easy to add components to it (without having to store your module in a variable) :

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

And the integration part is fairly simple: just add it as a dependency on your app module (here's how angular ui does it).

angular.module('myApp', ['myModuleName']); 
like image 102
gion_13 Avatar answered Sep 20 '22 14:09

gion_13