SoFunction
Updated on 2025-04-08

Analysis of the method of using the complete module to manually load AngularJS

This article analyzes the method of using AngularJS to manually load modules. Share it for your reference, as follows:

We have seen before that using the ng-app directive can realize automatic loading of modules. Now let's take a look at how to manually load modules in angular.This function needs to be used

<html>
  <head>
    <script src=""></script>
    <script>
    // Create moudle1    var rootMoudle = ('moudle1', []);
    ("controller1",function($scope){$="aty"});
    // Create moudle2    var m2 = ('moudle2', []);
    ("controller2",function($scope){$="aty"});
    // After the page is loaded, the module is loaded    (document).ready(function() {
      (("div1"),["moudle1"]);
      (("div2"),["moudle2"]);
    });
  </script>
  <head>
  <body>
    <div  ng-controller="controller1">div1:{{name}}</div>
    <div  ng-controller="controller2">div2:{{name}}</div>
  </body>
</html>

IE runs this web page and finds that the variables can be correctly parsed by the angular framework; F12 finds that the console also does not report an error. So far, we know how to load angular modules, and also understand the difference between manual loading and automatic loading. Next, we can continue to learn other knowledge of the AngularJS framework.

For more information about AngularJS, readers who are interested in view the topic of this site:AngularJS Introduction and Advanced Tutorial"and"AngularJS MVC architecture summary

I hope this article will be helpful to everyone's AngularJS programming.