Maison > Article > interface Web > Analyse du processus d'initialisation AngularJS (bootstrap)_AngularJS
Analyse du processus d'initialisation AngularJS (bootstrap)_AngularJS
- WBOYoriginal
- 2016-05-16 16:28:431124parcourir
Aperçu
Cette section explique le processus d'initialisation d'AngularJS et comment vous pouvez modifier l'initialisation d'AngularJS si nécessaire.
La balise <script> d'AngularJS </strong></p>
<p>Cet exemple montre notre méthode recommandée d'intégration d'AngularJS, appelée « auto-initialisation ». </p>
<p></p>
<div class="codetitle">
<span><a style="CURSOR: pointer" data="79377" class="copybut" id="copybut79377" onclick="doCopy('code79377')"><u>Copier le code</u></a></span> Le code est le suivant :</div>
<div class="codebody" id="code79377">
<br>
<!doctype html><br>
<html xmlns:ng="http://angularjs.org" ng-app><br>
<corps><br>
...<br>
<script src="angular.js"><script><br>
</corps><br>
</html><br>
</div>
<p><strong>formatDate</strong></p>
<p>1. Placez la balise script dans le code ci-dessus en bas de la page. Placer la balise script en bas raccourcit le temps de chargement de l'application car le chargement du HTML ne sera pas bloqué par le chargement des scripts angulaires.js. Vous pouvez obtenir la dernière version sur http://code.angularjs.org. Veuillez ne pas référencer cette URL dans votre code, car cela exposerait les risques de sécurité de votre site. S'il s'agit d'un développement expérimental, il n'y a aucun problème pour créer un lien vers notre site. </p>
<p>1).angular-[version].js est une version lisible adaptée au développement et au débogage. <br>
2).angular-[version].min.js est une version compressée et obscurcie, adaptée au déploiement dans des produits matures. </p>
<p>2. Veuillez placer la directive ng-app dans le nœud racine de votre application. Si vous souhaitez qu'AngularJS exécute automatiquement l'intégralité du programme <html> <br>
</p>
<p></p>
<div class="codetitle">
<span><a style="CURSOR: pointer" data="71091" class="copybut" id="copybut71091" onclick="doCopy('code71091')"><u>Copier le code</u></a></span> Le code est le suivant :</div>
<div class="codebody" id="code71091">
<br>
<html ng-app><br>
</div>
<p>3. Si vous souhaitez utiliser l'ancienne version de la syntaxe d'instruction : ng :, vous devez également écrire l'espace de noms XML en <html> pour que AngularJS fonctionne correctement sous IE. (Cela est fait pour certaines raisons historiques, nous ne recommandons pas de continuer à utiliser la syntaxe ng:.) </p>
<p></p>
<div class="codetitle">
<span><a style="CURSOR: pointer" data="49065" class="copybut" id="copybut49065" onclick="doCopy('code49065')"><u>Copier le code</u></a></span> Le code est le suivant :</div>
<div class="codebody" id="code49065">
<br>
<html xmlns:ng="http://angularjs.org"><br>
</div>
<p><strong>Initialisation automatique</strong></p>
<p>AngularJS s'exécutera lorsque l'événement DOMContentLoaded sera déclenché et trouvera la portée racine de votre application via la directive ng-app. Si la directive ng-app est trouvée, AngularJS : </p>
<p>1. Charger les modules liés au contenu de la commande. <br>
2. Créez une application "injecteur". <br>
3. Ayez déjà l'étiquette de la directive ng-app comme nœud racine pour y compiler le DOM. Cela vous permet de spécifier uniquement une partie du DOM pour votre application AngularJS. </p>
<p></p>
<div class="codetitle">
<span><a style="CURSOR: pointer" data="88586" class="copybut" id="copybut88586" onclick="doCopy('code88586')"><u>Copier le code</u></a></span> Le code est le suivant :</div>
<div class="codebody" id="code88586">
<br>
<!doctype html><br>
<html ng-app="optionalModuleName"><br>
<corps><br>
Je peux ajouter : {{ 1 2 }}.<br>
& Lt; script src = "angulaire.js" & gt; & lt;/script & gt;
</corps><br>
</html><br>
<br>
</div>
<p>Initialisation manuelle<strong></strong>
</p>Si vous devez contrôler activement le processus d'initialisation, vous pouvez utiliser la méthode d'exécution manuelle du programme de démarrage. Par exemple, vous l'utiliserez lorsque vous utiliserez un "chargeur de script" ou que vous devrez effectuer certaines opérations avant qu'AngularJS compile la page. <p>
</p>L'exemple suivant montre la méthode d'initialisation manuelle d'AngularJS. Son effet équivaut à l'utilisation de la directive ng-app. <p>
</p>
<p></p>
<div class="codetitle">
<span><a style="CURSOR: pointer" data="70023" class="copybut" id="copybut70023" onclick="doCopy('code70023')">Copier le code<u></u></a> Le code est le suivant :</span><div class="codebody" id="code70023">
<br>
<!doctype html><br>
<html xmlns:ng="http://angularjs.org"><br>
<corps><br>
Bonjour {{'Monde'}} !<br>
<script src="http://code.angularjs.org/angular.js"></script>
angulaire.element(document).ready(function() {
angulaire.bootstrap(document);
});