Le module est un moyen important d'organiser les modules en angulaire. Il offre la possibilité de résumer un ensemble de composants commerciaux cohérents (contrôleur, service, filtre, directive ...). Cela peut séparer le code en modules en fonction des problèmes de domaine commercial, puis utiliser la dépendance du module pour injecter le contenu de son module associé, afin que nous puissions mieux "séparer l'objectif" et obtenir une meilleure "cohésion élevée et couplage faible". "Haute cohésion et couplage faible" provient du principe de la conception orientée objet. La cohésion fait référence à l'intégrité du module ou de l'objet. Un ensemble de logique étroitement apparenté doit être encapsulé dans le même module, objet et autres unités de code, plutôt que dispersées partout; Le couplage fait référence au degré de dépendance entre les modules, les objets et autres unités de code. Si la modification d'un module affectera l'autre module, cela signifie que les deux modules sont interdépendants et étroitement couplés.
En même temps, le module est également l'entrée de notre code angulaire. Tout d'abord, vous devez déclarer le module, puis vous pouvez définir d'autres éléments de composants dans Angular, tels que le contrôleur, le service, le filtre, la directive, le bloc de code de configuration, le bloc de code d'exécution, etc.
La définition du module est: angular.module ('com.ngbook.demo', []). En ce qui concerne la fonction du module, trois paramètres peuvent être passés et ils sont:
Pour la méthode angular.module, nous avons des méthodes communes, à savoir angular.module ('com.ngbook.demo', [dépendance facultative]) et angular.module ('com.ngbook.demo'). Notez que c'est une manière complètement différente, l'une consiste à déclarer le module de création, et l'autre est d'obtenir le module déclaré. Dans la demande, la déclaration du module ne doit être et une seule fois; Pour obtenir le module, cela peut être plusieurs fois. Il est recommandé de séparer les composants angulaires dans différents fichiers, de déclarer le module dans le fichier de module et d'autres composants introduire le module. Il convient de noter que lors de l'introduction dans l'emballage ou le script, nous devons d'abord charger le fichier de déclaration du module, puis charger d'autres modules de composants.
Dans le groupe communautaire chinois angulaire, j'entends parfois certains étudiants poser des questions sur les erreurs "ng: areq":
[ng: areq] L'argument «Democtrl» n'est pas une fonction, n'est pas défini!
C'est souvent parce que vous oubliez de définir le contrôleur ou de déclarer le module plusieurs fois. La déclaration du module plusieurs fois entraînera la compensation des informations de définition du module précédent, de sorte que le programme ne trouvera pas les composants définis. Nous pouvons également l'apprendre à partir du code source angulaire (de Loader.js):
Fonction SetUpMoDuLeLoader (Window) {... Fonction Assure (OBJ, Name, Factory) {return obj [name] || (obj [name] = factory ()); } var angular = assure (fenêtre, 'angulaire', objet); return se assurer (Angular, 'module', function () {var modules = {}; return function module (name, requêtes, configfn) {var assertnothasownproperty = function (name, context) {if (name === 'Hasownproperty') {throw ngminerr ('badname', 'hasownproperty n'est pas un vallid {0}. AssertNothasownProperty (nom, 'module'); Si l'enregistrement d'un module assurez-vous que vous "+" spécifiez les dépendances comme deuxième argument. ", Nom);} var invokequeue = []; var runblocks = []; var config = invokelater ('$ injecteur', 'invoke'); var moduleInstance = {_invokequeue: invokeeue, _runblocks: invokelater ('$ fournir', 'fournisseur'), usine: invokelater ('$ fournir', 'usine'), service: invokelater ('$ fournir', 'service'), valeur: invokelater ('$ fournir', 'value'), constant: invokelater ('$', 'constant', 'unshift'), animation: invokelater ('$ animate invokerater ($ filterprovider ',' registre '), contrôleur: invokelater ($ ControllerProvider', 'registre'), config, config, run: function (block) {runblocks.push); moduleInstance; }; }); }Dans le code, nous pouvons comprendre que lorsque Angular est démarré, il mettra en place un objet angulaire global, puis publiera l'API du module sur l'objet angulaire. En ce qui concerne le code API du module, vous pouvez clairement voir la première ligne d'instruction de prédicat. Le nom du module ne peut pas être nommé d'après HasownProperty, sinon un message d'erreur de "badname" sera lancé. Immédiatement après, si un paramètre de nom est passé, ce qui indique qu'un module est déclaré, les informations du module existantes seront supprimées et définies sur NULL.
D'après la définition de la moduleInstance, nous pouvons voir que les API exposées par Angular.Module sont: invokequeue, runblocks, exige, nom, fournisseur, usine, service, valeur, constante, animation, filtre, contrôleur, directive, config et exécuter. Parmi eux, Invokequeue et Runblocks sont des attributs privés convenus par leur nom. Veuillez ne pas les utiliser à volonté. Les autres API sont les méthodes de définition des composants angulaires couramment utilisées. À partir du code invokelater, vous pouvez voir que le retour de ces définitions de composants angulaires est toujours une instance de moduleInstance, qui forme une API lisse. Il est recommandé d'utiliser des définitions de chaîne pour définir ces composants au lieu de déclarer une variable de module globale.
Enfin, si le troisième paramètre Configfn est passé, il sera configuré dans les informations de configuration. Lorsque l'Angular entre dans l'étape de configuration, ils seront exécutés à leur tour pour configurer l'application angulaire ou les composants angulaires tels que le service avant l'instanciation.
Ce qui précède est une compilation de l'énoncé du module angulaire et les informations obtenues surchargées. Nous continuerons d'ajouter des informations pertinentes à l'avenir. Merci pour votre soutien pour ce site Web!