SoFunction
Updated on 2025-04-11

Unconventional way to deal with AngularJS module management problems

1. Cause

I have been working on winform, and I was lucky enough to take a project from a master, express, angularJS and other projects that have many open source frameworks, and I have been working on it. So while learning, I used my past thoughts to sort out and refactor the code;

2. Problem

In some environments, you need to use BootStrap's modal box. Are we learning about win? . It was natural that I thought of turning the modal box of boosStrp into a general thing and calling it everywhere. . .

So the dialog file is referenced using patial, and the dialog itself uses anglurJS to communicate with the server.

Later I found that it is easy to use when only one is used. If you refer to multiple times (call different data) then only one is easy to use. .

3. Analysis

After checking some information, I realized that this call can only be executed once on the page, and it will be difficult to use if it is executed more. I wrote everything into a separate JS file before, and each JS file was called at the end, so it will naturally hang up;

4. Looking forward

So, I want to have a solution mechanism that allows me to part various files into the page at will, and there will be no repeated references between js files, and angulurJS can also be executed perfectly;

5. Solve

Dear friends - Although this method is a bit disgusting, it is absolutely direct and effective;

The idea is to dynamically maintain all AngularJS modules in a global array and then load them dynamically.

Not to mention it, post the code

Reference the file at the frame page (layout...) head, the code is as follows:

 = function (val) { 
  for( var i = 0; i < ; i++) {
    if(this[i] == val) return i;
          }
  return - 1;
      };
var jsModules = new Array();
function Confirm(val){
  if ((val) > -1)
    return;
  else
    (val);

};

Put the

Copy the codeThe code is as follows:

(document, [modulename]);

Replace with

Copy the codeThe code is as follows:

  Confirm(modulename);

Add the file at the end of layout (layout page? I don't know what it is, it's the public framework page anyway), the code is as follows:

Copy the codeThe code is as follows:

(function () {
    var app = ('app', jsModules);
    (document, ['app']);
})();

Hehe~~ I'm disgusted. . . Are you disgusted?

The above is the entire content of this article, I hope you like it.