AngularJS使用angular.bootstrap完成模塊手動(dòng)加載的方法分析
本文實(shí)例分析了AngularJS使用angular.bootstrap完成模塊手動(dòng)加載的方法。分享給大家供大家參考,具體如下:
之前我們看到使用ng-app指令,可以實(shí)現(xiàn)模塊的自動(dòng)加載?,F(xiàn)在我們看下,angular中如何手動(dòng)加載模塊。需要使用到angular.bootstrap這個(gè)函數(shù)。
<html> <head> <script src="angular.js"></script> <script> // 創(chuàng)建moudle1 var rootMoudle = angular.module('moudle1', []); rootMoudle.controller("controller1",function($scope){$scope.name="aty"}); // 創(chuàng)建moudle2 var m2 = angular.module('moudle2', []); m2.controller("controller2",function($scope){$scope.name="aty"}); // 頁面加載完成后,再加載模塊 angular.element(document).ready(function() { angular.bootstrap(document.getElementById("div1"),["moudle1"]); angular.bootstrap(document.getElementById("div2"),["moudle2"]); }); </script> <head> <body> <div id="div1" ng-controller="controller1">div1:{{name}}</div> <div id="div2" ng-controller="controller2">div2:{{name}}</div> </body> </html>
IE運(yùn)行這個(gè)網(wǎng)頁,發(fā)現(xiàn)變量能夠被angular框架正確解析;F12發(fā)現(xiàn)控制臺(tái)也沒有報(bào)錯(cuò)誤。到這里為止,我們知道了如何加載angular的模塊,也明白了手動(dòng)加載和自動(dòng)加載的區(qū)別。接下來,我們就可以去繼續(xù)學(xué)習(xí)AngularJS框架的其他知識(shí)。
更多關(guān)于AngularJS相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《AngularJS入門與進(jìn)階教程》及《AngularJS MVC架構(gòu)總結(jié)》
希望本文所述對(duì)大家AngularJS程序設(shè)計(jì)有所幫助。
- AngularJS $injector 依賴注入詳解
- AngularJs學(xué)習(xí)第五篇從Controller控制器談?wù)?scope作用域
- 深入解析AngularJS框架中$scope的作用與生命周期
- angularJS 中$scope方法使用指南
- AngularJS框架中的雙向數(shù)據(jù)綁定機(jī)制詳解【減少需要重復(fù)的開發(fā)代碼量】
- AngularJs中 ng-repeat指令中實(shí)現(xiàn)含有自定義指令的動(dòng)態(tài)html的方法
- AngularJS的依賴注入實(shí)例分析(使用module和injector)
- AngularJS 使用ng-repeat報(bào)錯(cuò) [ngRepeat:dupes]
- AngularJS使用ng-inlude指令加載頁面失敗的原因與解決方法
- Angularjs實(shí)現(xiàn)搜索關(guān)鍵字高亮顯示效果
- AngularJS中的緩存使用
- AngularJS中$injector、$rootScope和$scope的概念和關(guān)聯(lián)關(guān)系深入分析
相關(guān)文章
angularJS?實(shí)現(xiàn)長(zhǎng)按不觸發(fā)點(diǎn)擊事件可以復(fù)制剪貼方法
這篇文章主要為大家介紹了angularJS實(shí)現(xiàn)長(zhǎng)按不觸發(fā)點(diǎn)擊事件可以復(fù)制剪貼方法詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-06-06簡(jiǎn)單講解AngularJS的Routing路由的定義與使用
這篇文章主要介紹了AngularJS的Routing路由的定義與使用,講解了when()和otherwise()兩個(gè)相關(guān)的常用方法,需要的朋友可以參考下2016-03-03AngualrJS中每次$http請(qǐng)求時(shí)的一個(gè)遮罩層Directive
AngularJS是一款非常強(qiáng)大的前端MVC框架。接下來通過本文給大家介紹AngualrJS中每次$http請(qǐng)求時(shí)的一個(gè)遮罩層Directive,本文非常具有參考借鑒價(jià)值,特此分享供大家學(xué)習(xí)2016-01-01Angular企業(yè)級(jí)開發(fā)——MVC之控制器詳解
本篇文章主要介紹了Angular企業(yè)級(jí)開發(fā)——MVC之控制器詳解,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-02-02