Angular module declares and gets overloaded instance code _ANGULARJS

Module is an important modular organization in angular, which provides a set of cohesive business components (Controller, service, filter, directive ...). ) The ability to encapsulate together. Doing so allows the code to be encapsulated in a module based on the business domain problem, then injecting its associated module content with the dependency of module, allowing us to better "separate the focus" and achieve better "high cohesion and low coupling". "High cohesion low coupling" comes from the object-oriented design principle. Cohesion is the internal integrity of a module or object, a set of tightly linked logic should be encapsulated in a unit of code such as the same module, object, and so on, rather than scattered around; coupling refers to the degree of dependency between modules, objects, and other units of code, and if one module changes, it affects another module, It shows that the two modules are interdependent and tightly coupled.

While module is also the entry point for our angular code, we first need to declare module before we can define other component elements in angular, such as controller, service, filter, Directive, Config code block, Run code block, and so on.

The definition of module is: Angular.module (' Com.ngbook.demo ', []). About the module function can pass 3 parameters, respectively:

1. Name: module definition, which should be a unique, required parameter, which is injected behind other modules or declares the application master module in the ngapp instruction;
2. Requires: module dependencies, which are parameters that declare that the module needs to rely on other modules. Special NOTE: If you do not declare the dependency of the module here, we cannot use any component of the dependency module in the module; it is an optional parameter.
3. CONFIGFN: The module's startup configuration function, which is called during the angular config phase, to a specific configuration prior to instantiating an object instance of a component in a module, such as our common routing information for the $routeprovider configuration application. It is equivalent to the "module.config" function, and it is recommended that you replace it with the "module.config" function. This is also an optional parameter.
   

For the Angular.module method, we often have the kind of approach that is angular.module (' Com.ngbook.demo ', [optional dependency]) and Angular.module (' Com.ngbook.demo '). Note that it is a completely different way, one is to declare a module, and the other is to obtain a module that has already been declared. In an application, the declaration of a module should have and only once, and there can be multiple times for getting the module. It is recommended that the angular component be isolated separately in different files, the module file declared module, the other components introduce module, it should be noted that when packaged or script introduced, we need to first load the module declaration file, You can then load additional component modules.

In the angular Chinese community, some students sometimes hear questions about "ng:areq":

[Ng:areq] Argument ' Democtrl ' is not a function, got undefined!

This is often due to forgetting to define controller or declaring multiple modules, and declaring the module multiple times causes the front module definition information to be emptied, so the program cannot find the defined component. This we can also learn from the angular source (from Loader.js):

function Setupmoduleloader (window) {... function ensure (obj, name, factory) {return Obj[name] | |
      (Obj[name] = Factory ());
      var angular = ensure (window, ' angular ', Object);
        return ensure (angular, ' module ', function () {var modules = {};
            return function module (name, requires, CONFIGFN) {var assertnothasownproperty = function (name, context) { if (name = = = ' hasOwnProperty ') {throw ngminerr (' badname ', ' hasownproperty is not ' a valid {0} name '),
            context);

          }
          };
          Assertnothasownproperty (Name, ' module ');
          If (Requires && Modules.hasownproperty (name)) {Modules[name] = null; return ensure (modules, name, function () {if (!requires) {throw $injectorMinErr (' No MoD ', ' Module ' {0} ' is not available! You are either misspelled "+" the module name or forgot to load it. If Registering a Module Ensure that you "+" Specify the dependencies as the second argument. ", name);
            } var invokequeue = [];
            var runblocks = [];
            var config = invokelater (' $injector ', ' invoke '); var moduleinstance = {_invokequeue:invokequeue, _runblocks:runblocks, require  S:requires, Name:name, Provider:invokelater (' $provide ', ' provider '), factory: Invokelater (' $provide ', ' Factory '), Service:invokelater (' $provide ', ' service '), Value:invok Elater (' $provide ', ' value '), Constant:invokelater (' $provide ', ' constant ', ' unshift '), Animati
              On:invokelater (' $animateProvider ', ' Register '), Filter:invokelater (' $filterProvider ', ' register '), Controller:invokelater (' $controllerProvider ', ' Register '), Directive:invokelater (' $compileProvider ')
  , ' directive '),            Config:config, Run:function (block) {Runblocks.push (block);
              return this;
            }
            };
            if (CONFIGFN) {config (CONFIGFN);

            return moduleinstance; function Invokelater (provider, method, InsertMethod) {return function () {Invokequeue[inser TMethod | |
                ' Push '] ([Provider, method, arguments]);
              return moduleinstance;
            };
        }
          });
      };
    });

 }

In the code, we can see that when angular starts, it sets the global angular object and then publishes the module API on the angular object. About module API code, can clearly see the first line predicate statement, module name can not be named hasOwnProperty, otherwise it will throw "Badname" error message. Immediately thereafter, if the name parameter is passed in, and the representation is the declaration module, the existing module information is deleted and placed to null.

From the definition of moduleinstance, we can see that the APIs that angular.module exposes for us are: Invokequeue, Runblocks, requires, name, provider, factory, Servic , value, constant, animation, filter, controller, Directive, Config, run. Where Invokequeue and Runblocks are private properties agreed by name, please do not use them at will, other APIs are our common angular component definition method, The return of such angular component definitions from the Invokelater code is still a moduleinstance instance, which forms a fluent API, and it is recommended that these components be defined by a chain instead of declaring a global module variable.

Finally, if the third parameter CONFIGFN is passed in, it is configured into config information, and when angular enters the config phase, they are executed sequentially to configure the angular application or the angular component, such as service, before instantiating it.

The above is the angular module statement and get the heavy load of data collation, follow-up continue to supplement the relevant information, thank you for your support of this site!