Non-conventional processing method of ANGULARJS module management problem

Source: Internet
Author: User

This article mainly introduces the Angularjs module management Problem of unconventional processing method, is a helpless, to share to the small partners, we can refer to.

1. Causes

Oneself has been doing winform, fortunately from a big God hand picked up a node.js,express,angularjs, such as a set of many open source framework of a project, spot, so while learning, while using their previous thinking to organize, refactoring code;

2. The question

In some environment, need to use bootstrap modal frame, we are learning win? It's natural to think of the boosstrp modal box as a universal thing, calling around ...

Then use Patial to refer to the dialog box file, the dialog itself with Anglurjs for server-related communication.

It turns out that when you use only one, it works, and if you refer to it multiple times (call different data), there's only one.

3. Analysis

Check some information to understand, angular.bootstrap this call on the page can only be executed once, more than the implementation is not used, and I will have all angular.module written in a separate JS file, each JS file finally called the Angular.bootstrap So, the natural will hang out;

4. Looks forward to

So, want to have a solution mechanism, let me partial all kinds of files to the page, and JS file will not duplicate the reference, Angulurjs can also be perfect implementation;

5. Address

Pro-although this way a bit disgusting, but absolutely directly effective;

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

No, put the code.

On frames page (layout ...) The head refers to the Angulurinit.js file with the following code:


1 2 3 4 5 6 7 8 9 10 11 12 13-14 Array.prototype.indexOf = function (val) {for (var i = 0; i < this.length. i++) {if (this[i] = val) return i;} retur n-1; }; var jsmodules = new Array ();   Function Confirm (val) {if (Jsmodules.indexof (val) > 1) return; else Jsmodules.push (Val); };

Each of the Anglur.js modules

The code is as follows:

Angular.bootstrap (document, [ModuleName]);

Replace into

The code is as follows:

Confirm (ModuleName);

In Layout (Layout page? I don't know what it is, anyway. The common frames page) the tail is added to the Angulur.js file, the code is as follows:

The code is as follows:

(function () {

var app = Angular.module (' app ', jsmodules);

Angular.bootstrap (document, [' app ']);


The above mentioned is the entire content of this article, I hope you can enjoy.

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

11.11 Big Sale for Cloud

Get Unbeatable Offers with up to 90% Off,Oct.24-Nov.13 (UTC+8)

Get It Now >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.