In-depth analysis of module _ AngularJS in AngularJS

The module we call is an integral part of your AngularJS application. it can be a Controller, a Service, or a Filter ), it can also be a directive (command) and so on... All belong to one module. This article will introduce you to the module (module) in AngularJS. if you are interested, study it together. What is AngularJS module?

The module we call is an integral part of your AngularJS application. it can be a Controller, a Service, or a Filter ), it can also be a directive (command) and so on... All belong to a module!

Most applications have their own function entry method Main, which is used for initialization and loading and assembling modules. then, the combination of these modules constitutes your application, right?

However, the but and AngularJS applications are not like this. it does not have the main method or function entry. Instead, specify in the module how to declare the module to load and start in AngularJS applications.

This method has the following advantages:

1) using declarations makes it easier to understand.

2) you can easily reuse your code.

3) the module loading sequence is easier to control. Because these modules are delayed for execution.

4) unit tests become more convenient. More reliable, you only need to load this module to test.

5) during end-to-end testing, you can use the module to rewrite the configuration.

In AngularJS, module is a core existence, including many aspects, such as controller, config, service, factory, directive, and constant.

How to implement functions similar to modules in Javascript?

Or, we define a function. how can we open the functions in the function to the outside world?

I think the function in a function can be used as the key value of an object to open it to the outside world.

This is very general, but it is actually like this:

var myModule = function outerFuction(){  var method1 = new function(){}  var method2 = new function(){}  return{    method1: method1,    method2, method2  }}var o = outerFucntion();o.method1();o.mehtod2(); 

For example, a bank saves money to withdraw money.

Var account = function () {// balance var balance = 0; // save var deposit = function (money) {balance + = money; console. log ("The balance on the card is:" + balance); policyuser () ;}// get the money var withdraw = function (money) {balance-= money; console. log ("The balance on the card is:" + balance) notifyUser ();} // notify the user var policyuser = function () {console. log ("balance changed on the card");} return {deposit: deposit, withdraw: withdraw} var a1 = account (); a1.deposit (100); a1.withdraw (50 );

Then we came to AngularJS and we were used to writing like this:

var app = angular.module('app',[]);app.config();app.controller();app.factory();... 

That is, obtain the module and then call the method provided by the module.

View angular. js source code and find:

angular = window.angular || (window.angular = {} )

This is why angular is used.

...var moduleInstace = {    provider: invokeLater('$provide','provider'),    factory: invokeLater('$provider', 'factory'),    service: invokeLater('$provider', 'service'),    value: invokeLater('$provide', 'value'),    constant: invokeLater('$provider', 'constant'...),    animation: invokeLater('$animateProvider',...),    filter: invokeLater('$filterProvider',...),    controller: invokeLater('$controllerProvider',...),    directive: invokeLater('$compileProvider',...),    config: config,}return moduleInstance;... 

The above code is exactly the module code.

PS: There is a small but important difference between angular. module ('myapp', [...]) and angular. module ('myapp ').

Angular. module ('myapp', [...]) A new Angular module is created, and square brackets ([...]) are placed. and angular. module ('myapp') uses the existing module defined by the first call.

Therefore, for the following code, you must ensure that only one application is used:

Angular. module ('myapp', [...]) // If your application is modular, it may be MyModule

If you do not want to store the reference of a module in a variable and reference the module in the entire application, use angular in other files. the module (MyApp) method ensures correct AngularJS module references. Everything on the module must be defined by accessing this module reference, or add necessary content in the module definition.