Maison >interface Web >js tutoriel >Moyens non conventionnels de gérer les problèmes de gestion des modules AngularJS_AngularJS

Moyens non conventionnels de gérer les problèmes de gestion des modules AngularJS_AngularJS

WBOY
WBOYoriginal
2016-05-16 16:01:421322parcourir

1.Cause

J'ai travaillé sur winform, et j'ai eu la chance de reprendre un projet d'un maître qui intègre de nombreux frameworks open source comme node.js, express, angulaireJS, etc., et de le mettre rapidement en rayon, j'ai donc appris en utilisant mes idées passées Organiser et refactoriser le code

2.Question

Dans certains environnements, il est nécessaire d'utiliser la boîte modale de BootStrap. Apprenons-nous de win ? . Naturellement, j'ai pensé à intégrer la boîte modale boostStrp dans un truc universel et à l'appeler partout. . .

Le fichier de dialogue est donc référencé à l'aide de patial et la boîte de dialogue elle-même utilise anglurJS pour la communication liée au serveur.

Plus tard, j'ai découvert que cela fonctionnait bien lorsqu'un seul était utilisé. S'il est référencé plusieurs fois (en appelant des données différentes), alors un seul fonctionnerait. .

3. Analyse

Après avoir vérifié certaines informations, j'ai réalisé que l'appel angulaire.bootstrap ne peut être exécuté qu'une seule fois sur la page. S'il est exécuté plusieurs fois, il ne sera pas utile. Et j'ai déjà écrit tous les fichiers angulaires.module dans des fichiers JS séparés, chacun. time Un fichier JS appelle enfin angulaire.bootstrap, donc il échouera naturellement

;

4. J'attends ça avec impatience

Donc, je veux avoir un mécanisme de solution qui me permette d'ajouter partiellement divers fichiers à la page à volonté, et les fichiers js ne seront pas référencés à plusieurs reprises, et AngulurJS peut également être parfaitement exécuté

;

5.Solution

Chers amis, même si cette méthode est un peu dégoûtante, elle est absolument directe et efficace

;

L'idée est de maintenir dynamiquement tous les modules AngularJS dans un tableau global puis de les charger dynamiquement

Ne parlez plus, postez simplement le code

Référencez le fichier angulurinit.js en tête de page du frame (layout...), le code est le suivant :

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

};

Remplacer

dans chaque module angul.js

Copier le code Le code est le suivant :

angulaire.bootstrap(document, [nom du module]);
Remplacez

par

Copier le code Le code est le suivant :

Confirmer(nom du module);

Ajouter le fichier angulur.js à la fin de la mise en page (page de mise en page ? Je ne sais pas comment ça s'appelle, de toute façon, c'est la page du cadre public Le code est le suivant :

).

Copier le code Le code est le suivant :

(fonction () {
var app = angulaire.module('app', jsModules);
Angular.bootstrap(document, ['app']);
})();

Héhé~~ Je me sens malade. . . Est-ce que ça vous rend malade ?

Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn