AngularJS – Module

In Angular, a module is the main way to define an AngularJS app. The module of an app is where we’ll contain all of our application code. An app can contain several modules, each one containing code that pertains to specific functionality. You can think of a module as container for the different parts of your app – controllers, services, filters, directives etc.

Modules provide us a lot of advantages, such as

•        Keeping our global namespace clean.
•         Making testing easier as independent modules can be tested separately.
•         Making it easy to share code between applications.
•          Allowing our app to load different parts of code in any order.

The angular modules API allows us to declare a module using the angular.module() method.
When declaring a module, we need to pass two parameters to the method. First is the module name and second one is the list of Dependencies also known as injectable.

angular.module(‘moduleName’, []);

However we can also use the overloaded method with single parameter as shown below,

angular.module(‘ModuleName,);

Example

In following example we going to create two modules

•          Application Module – used to initialize an application with controllers.
•         Controller Module – used to define a controller.

MyApp.js

Var app  =  angular.module(“myApp”, []);

MyController.js

App.Controller(“myController”, function($scope) {

                $scope.firstName = “Jatin”;

                $scope.lastName = “Patil”;

});

AngularJSModule.html

 

Output