angularjs詳細(xì)使用說明從零到高手

上傳人：我*** IP屬地：北京上傳時間：2023-02-25 格式：DOCX 頁數(shù)：141 大?。?.63MB 積分：12 舉報 版權(quán)申訴

已閱讀5頁，還剩136頁未讀，繼續(xù)免費(fèi)閱讀

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南01：AngularJS簡日raAngularJS是一個為動態(tài)WEB應(yīng)用設(shè)計的結(jié)構(gòu)框架。它能讓你使用HTML作為模板語言，通過擴(kuò)AglrJS是為了克服HTML在構(gòu)建應(yīng)用上的不足而設(shè)計的。HTML是一門很好的為靜態(tài)文本展示設(shè)計的式語言，但要構(gòu)建WB應(yīng)用的話它就顯得乏力了。所以我做了一些工作（你也可以覺得是小花招）來讓瀏覽器做要的事。類庫－類庫是一些函數(shù)的集合，它能幫助你寫WEB應(yīng)用。起主導(dǎo)作用的是你的代碼，由你來決定何時使框架－框架是一種特殊的、已經(jīng)實(shí)現(xiàn)了的WEB應(yīng)用，你只需要對它填充具體的業(yè)務(wù)邏輯。這里框架主導(dǎo)作用的，由它來根據(jù)具體的應(yīng)用邏輯來調(diào)用你的代碼?？蚣苡? 等使大括語法進(jìn)行數(shù)據(jù)綁定使用DOM控制結(jié)構(gòu)來實(shí)現(xiàn)迭代或者隱藏DOM片段；支持表單和表單的驗證；能將邏輯代碼關(guān)聯(lián)到相關(guān)的DOM元素上；能將HTML分組成可噩用的組件。端對端的解決方Create、查詢Retreve、更新Update、刪除Delete）的應(yīng)用時顯得很“固執(zhí)”（原文為構(gòu)建一個CRUD應(yīng)用可能用到的全部內(nèi)容包括：數(shù)據(jù)綁定、基本模板標(biāo)識符、表單驗證、路由、深度鏈接、組件噩用、依賴注入。測試方面包括：單元測試、端對端測試、模擬和自動化測試框架。具有布局和測試的應(yīng)用作為起點(diǎn)。要考慮的是構(gòu)建CRUD應(yīng)用。幸運(yùn)的是，至少90％的WEB應(yīng)用都是CRUD應(yīng)用。但是要了解什么適合用AngularJS構(gòu)建，就得了解什么不適合用AnguarJS構(gòu)建。同，它們不適合用AngularJS來構(gòu)建。?這種?用一些更?星、簡單的

將數(shù)據(jù)模型(daa－model)關(guān)聯(lián)到視圖(I)上；寫、讀、驗證用戶的輸入；index.htm<!doctype<!doctype<htmlng- <script<divng- <td><inputtype="integer"min="0"ng-model="qty"required<td><inputtype="number"ng-model="cost"required<b>Total:</b>{{qty*cost|tltl($scope)$scope.qty=$scope.cost=}end-to-enditit('shouldshowofangularbinding',{expect(binding('qty*cost')).toEqual('$19.95');expect(binding('qty*運(yùn)行: 11Total:ng-ng- 里,我們用一個標(biāo)識符標(biāo)明這是一個AnguarJS應(yīng)用。這個符會使AnguarJS自動初始化(autoinitialize)你的應(yīng)用。ng-ng- 我們通過設(shè)置屬性 ty:ty:<inputtype="integer"min="0"ng-model="qty"requiredCost:<inputtype="number"ng-model="cost"required當(dāng)頁面加載完后，AngularJS會依照widget里的的模型名字(、以把這些變量認(rèn)為是MVC設(shè)計模式中的M(Mode)

注意上面widget里有著特殊的能力。如沒有輸入數(shù)據(jù)或者輸入的數(shù)據(jù)無效，個證功

輸入框會自動變紅。輸入框的這種新特性，能讓開發(fā)者更容易實(shí)現(xiàn)CRUD應(yīng)用里常見的字段了TotalTotal:{{qty*cost|{{表達(dá)式 {{表達(dá)式輯，就是完成了上述功能。這個實(shí)現(xiàn)的背后是因為瀏覽器做了比以往生成靜態(tài)頁面的工作，讓它能滿足動態(tài)WEB應(yīng)用的需要。AnguarJS使得動態(tài)WEB應(yīng)用的開發(fā)開監(jiān)降到不需要類庫或者框架的程將DOM操作和應(yīng)用邏輯解耦是一種非常好的思路，它能大大改善代碼的可調(diào)性將測試和開發(fā)同等看待是一種非常非常好的思路，測試的難度在很大程度上取決于代碼的結(jié)構(gòu)將戶端和服務(wù)器端解耦是一種特別好的做法，它能使兩邊并行開發(fā)，并且使兩邊代碼都能實(shí)現(xiàn)重用；如果框架能夠在整個開發(fā)流程里都引導(dǎo)著開發(fā)者：從設(shè)計UI，到編寫業(yè)務(wù)邏輯，再到測試，那對開發(fā)者將是極大的幫助；“化繁為簡，化簡為零”總是好的使用回調(diào)：回調(diào)的使用會打亂你的代碼的可讀性，讓你的代碼變得支離破碎，很難看清本來的業(yè)務(wù)邏輯。移除一些常見的代碼，例如回調(diào)，是件好事。大幅度地減少你因為Javacript這開語言的設(shè)計而不得不寫的代碼，能讓你把自己應(yīng)用的邏輯看得更清楚。手動編寫操作DM元素的代碼：操作DOM是AJAX應(yīng)用很基礎(chǔ)的一部分，但它也總是很“笨重”并且容易出錯。用的方式描述的I界面可隨著應(yīng)用狀態(tài)的改變而變化，能讓你從編寫低級的DOM操作代碼中解脫出來。絕大部分用AngularJS寫的應(yīng)用里，開發(fā)者都不用再自己去寫操作DOM的代碼，不過如果你想的話還是可以去寫。對UI界面讀寫數(shù)據(jù)：AJAX應(yīng)用的很大一部是CRUD操作。一個經(jīng)典的流程是把服務(wù)端的數(shù)據(jù)組建成內(nèi)部對象，再把對象編成HTML表單，用戶修改表單后再驗證表單，如果有錯再顯示錯誤，然后將數(shù)據(jù)重新組建成內(nèi)部對象，再返回給服務(wù)器。這個流程里有太多太多要重復(fù)寫的代碼，使得代碼看起來總是在描述應(yīng)用的全部執(zhí)行流程，而不是具體的業(yè)務(wù)邏輯和業(yè)務(wù)細(xì)節(jié)。開始前得寫大量的基礎(chǔ)性的代碼：通常你需要寫很多的基礎(chǔ)性的代碼才能實(shí)現(xiàn)一個“oWord”的應(yīng)用。用AngulrJS的話，它會提供一些服務(wù)讓你很容易地正式開始寫你的應(yīng)用，而這些服務(wù)都是以一種Guice-likedependency-injection式的依賴注入自動加入到你的應(yīng)用中去的,這讓你能很決的進(jìn)入你應(yīng)用的具體開發(fā)。特別的是，你還能全盤掌握自動化測試的初始化過程。：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼TheMITLicense&&文檔 CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南02：引導(dǎo)程日ra<!doctype<!doctype<html"ng-<script*將上面代碼中

angular-[version].js是具有可讀性的版本,適合開發(fā)和調(diào)試angular-[version].min.js是壓縮后的版本,適合部署到成型產(chǎn)品中請將ng-app指令放到你的應(yīng)用的根節(jié)點(diǎn)中,如果你想要AngularJS自動執(zhí)行整個就把它放在<html> <html<htmlng-如果你想使用舊版的指令語法：，那還需要寫才能使AnguarJS在IE下正常工作。(這樣做是因為一些歷史原因,我們不推薦繼續(xù)使指令尋找你的應(yīng)用根作載入和指令內(nèi)容相關(guān)的模塊創(chuàng)建一個應(yīng)用的“注入器(injector<!doctype<htmlng-Icanadd:{{1+2<script已擁有指令的為根節(jié)點(diǎn)來編譯其中的D<!doctype<htmlng-Icanadd:{{1+2<script 加載器(scriptloader)”，或者需要在AngularJS編譯頁面之前做一些操作，你就會用到它<!doctype <!doctype o { 等頁面和所有的加載完之后，找到HTML模板的根節(jié)點(diǎn)——通常就是文檔的根節(jié)點(diǎn)調(diào)用ap/anguar.bootstrap將模板編譯成可執(zhí)行的、數(shù)據(jù)雙向綁定的應(yīng)用程序：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼 TheMITLiense&&文檔CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南03：HTML編譯日ra告訴瀏覽器“去找到窗口的中點(diǎn)位置，然后踉內(nèi)容的中間結(jié)合”。align="center"用有用的指令。這些擴(kuò)展的指令就是你創(chuàng)建APP的“特定領(lǐng)域語言( ana編譯器編譯：遍歷DOM并且收集所有的相關(guān)指令，生成一個函數(shù)：給指令綁定一個作用域，生成一個動態(tài)的視圖。作用域模型的任何改變都會反映到視圖上，并且視圖上的任何用戶操作也都會反映到作用域模型。這使得作用域模型成為你的業(yè)務(wù)邏輯里唯一要關(guān)心的東西。ng- ng-<spanng-<spanclass="ng-bind:<ng-bind></ng-<!--directive:ng-bindexp--<spanng-<spanclass="ng-bind:<ng-bind></ng-<!--directive:ng-bindexp--

<!doctype<!doctype<htmlng- <script<spandraggable>Dragangularangular.module('drag',directive('draggable',)varvarstartX=0,startY=0,x=0,y=returnfunction(scope,element,{element.css({position:'relative',border:'1pxsolidred',backgroundColor:'lightgrey',cursor:'pointer'element.bind('mousedown',{startX=event.screenX-x;startY=event.screenY-y; functionmousemove(event)y=event.screenY-startY;x=event.screenX-startX;top:y+'px',left:x+'px'functionmouseup()$$ 運(yùn)行Drag 這意味著數(shù)據(jù)上的任何改變，都會導(dǎo)致數(shù)據(jù)要噩新和模板結(jié)合生成新字符，再插入到M里。這其中會出現(xiàn)的問題有：需要用戶輸入并和模型的數(shù)據(jù)結(jié)合，需要覆寫用戶的輸入，需要手動管理整個更新過程，缺少豐富的表現(xiàn)形式。是“透明的”。開發(fā)者不需要做任何關(guān)于更新視圉的工作。并且應(yīng)用沒有用到ierHTML，所以我們立不用覆寫用戶的輸入。更特別的是，Aglr的指令不僅僅能使用字符串形式的綁定，還可以使用一些指示行為的結(jié)構(gòu)體。AglrJS的編譯會生成一個“穩(wěn)定的D”。這意味綁定了數(shù)據(jù)模型的M元素的實(shí)例不會在綁定的生命周期中發(fā)生改變。這也意味著代碼中可以獲取到OM元素的實(shí)例并，不用擔(dān)心這用會在模板和數(shù)據(jù)的結(jié)合時丟失。：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼TheMITLicense&&文檔 CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南04：概日ra啟動(startup)－展示“o執(zhí)行期(runtime)－AngularJS執(zhí)行期概覽作用域(scope)－視圖和控制器的集合區(qū)控制器(controller)－應(yīng)用的行為模型(model)－應(yīng)用的數(shù)據(jù)視圖(view)－用戶能看指令(directives)－擴(kuò)展HTML語法過濾器(filters)－數(shù)據(jù)本地化注入器(injector)－聚合你的應(yīng)用模塊(module)－配置注入器$－AnguarJS名空間瀏覽器載入HTML，然后把它解析成DOM瀏覽器載入 AngularJS等到觸發(fā)AngularJS尋找ng-app指令，這個指令指示了應(yīng)用使中指定的模塊來配置注入器($injector)注入器($injector)是用來創(chuàng)建“編譯服務(wù)($compieservice)”和“根作用域($rootScope)”的編譯服務(wù) service)是用來編譯DOM并把它到根作用域($rootScope)的ng-init指令將“World”賦給作用域里的name這個變通過{{name的替換，整個表達(dá)式變成了“HeloWorld<!doctype<!doctype<htmlng-<png-init="name='World' o運(yùn)行瀏覽器的循環(huán)等待的觸發(fā)。所謂包括用戶的交互操作、定件、或者網(wǎng)絡(luò)(服務(wù)器的響應(yīng))。觸發(fā)后，回調(diào)會被執(zhí)行。此時會進(jìn)入Javascript上下文。通?；卣{(diào)可以用來修改DOM結(jié)構(gòu)一旦回調(diào)執(zhí)行完畢，瀏覽器就會離開 pt上下文，并且根據(jù)DOM的修改重新渲染視圖AglrJS通過使用自己的處理循環(huán)，改變了傳統(tǒng)的Javscript工作流。這使得avscrpt的執(zhí)行被分成原始部分和擁有AglrS執(zhí)行上下文的部分。只有在AgrS執(zhí)行上下文中運(yùn)行的操作，才能享受到AglrJS提供的數(shù)據(jù)綁定，異常處理，資漁管理等功能和服務(wù)。你可以使用來從普通Javascript上下文進(jìn)入AnguarJS執(zhí)行上下文。記住，大部分清況下（如在控制通過調(diào)AngularJS執(zhí)行上下文中執(zhí)行

來進(jìn)入AngularJS的執(zhí)行上下文，這里的stimulusFn是你??AngularJS會執(zhí) ，這個函數(shù)一般會改變應(yīng)用的狀態(tài)AngularJS進(jìn)入＄digest循環(huán)。這個循環(huán)是由兩個小循環(huán)組成的，這兩個小循環(huán)用來＄elAyc隊列和＄wch列表。這個＄des循環(huán)直到模型“穩(wěn)定”前會一直迭代。這個穩(wěn)定具體指的是＄ely對表為空，并且＄wc這個 Async隊列是用來管理那些“視圖渲染前需要在當(dāng)前棧框架外執(zhí)行的操作的”。這通常使來完成的。按順序渲染視圖的，還會造成視圖

會有?的問題。并且，因為瀏覽器是根據(jù)隊.＄watch列表是一個表?式的?合，這些表?式可能是自上迭代后發(fā)?了改變的。如果有檢測到了變，那么＄watch函數(shù)就會被調(diào)用，它通常會把新的值更新到DOM中。6.一旦AngularJS的＄digest循環(huán)結(jié)束，整個執(zhí)行就會離開AnguarJS和Javascript的上下文。這些都是在瀏覽器為數(shù)據(jù)改變而進(jìn)行重渲染之后進(jìn)行的。 wrd“的例子是怎么樣實(shí)現(xiàn)“將用戶輸入綁定到視圖上”的效果在編譯階段input上的ng-model指令輸入框綁定了keydown在執(zhí)行期階段

這個變量替換表單式建立了一個＄watch來接受name變量改變按下任何一個鍵(以X鍵為例)，都會觸發(fā)一個input輸入框的keydowninput上的指令??到input里值得改變，然后調(diào)用apl(a#X!“)來更新處于AngularJS＄digest循環(huán)開始

應(yīng)用到模型上＄wch列表檢測到了nme將DOM進(jìn)行更新；

變量替換的表?式，這個表?式AngularJS退出執(zhí)行上下文，然后退出Javascript上下文中的keydown瀏覽器以更新的文本重渲染<!doctype<!doctype<htmlng-<inputng- o運(yùn)行

<!doctype<html<!doctype<htmlng- <script<divng-controller="GreetCtrl">o{{name}}!<divng-<ling-repeat="namein.show- .doc-example-live.ng-.show-scope.doc-example-live.ng-{border:1pxsolidred;margin:3px;}functionGreetCtrl($scope)$=}functionListCtrl($scope)$s=['Igor','Misko',}運(yùn)行到視圖。視圖可以看做是作用域在模板(HTML)上的“投影(projection)”。而作用域是一個中間地控制器是由Javacript寫的。Javacript是命令式的，命令式的語言適合用來編寫應(yīng)用的行為?？刂破鞑粦?yīng)該包含任何關(guān)于渲染代碼(DM 或者片段）。視圖模板是用HTML寫的。HTML是是的，式的語言適合用來編寫UI。視圖不應(yīng)該包含任何行為。因為控制器和視圖沒有直接的調(diào)用關(guān)系，所以可以使多個視圖對應(yīng)同一個控制器。這對“換膚(re-<!doctype<!doctype<htmlng- <script<divng-controller="MyCtrl">o{{name}}!<buttonng-functionfunctionMyCtrl($scope)$scope.action=function()$=}$=}運(yùn)行也不需要實(shí)現(xiàn)指定的方法以供調(diào)用或者改變模型。對象類型的。簡而言之，模型可以是原生的Javascrpt對象。其他模板－大部分模板系統(tǒng)工作原理，都是一開始獲取一個中有特殊標(biāo)記的HTML形式字符串。通常情況下模板的特殊標(biāo)記破換了HTML的語法，以至于模板是不能用HTML編輯器編輯的。然后這個字符串會被送到模板引擎那里解析，并和數(shù)據(jù)合并。合并的結(jié)果是一個可以被瀏覽器解析的HTML字符串。這個字符串會被方法寫到OM中。使用inerHL會造成瀏覽器的重新渲染。當(dāng)模型改變時，這整個流程又要重復(fù)一遍。模板的生存周期就是DOM的更新周期。這里強(qiáng)調(diào)是，這些模板系統(tǒng)模板的基礎(chǔ)是字符串。AngularJS－AngularJS和其它模板系統(tǒng)不同。它使用的是DOM而不是字符串。模板仍然是用HTML字符串寫的，并且它仍然是HTML。瀏覽器將它解析成DOM，然后這個DOM會作為輸入傳遞給模板引擎，也就是我們的編譯器。編譯器查看其中的指令，找到的指令后，會開始監(jiān)視指令內(nèi)容中相應(yīng)的模型。這樣做，就使得視圖能“連續(xù)地”更新，不需要模板和數(shù)據(jù)的重新合并。你的模型也就成了你視圖變化的唯一動因。<!doctype<!doctype<htmlng-<divng-init="list=['Chrome','Safari','Firefox','IE']<inputng-model="list"ng-list><inputng-model="list"ng-list> <ling-repeat="itemin運(yùn)行<!doctype<!doctype<htmlng- <script<divcontentEditable="true"ng-model="content">Edit<pre>model=<!doctype<!doctype<htmlng- <script<divcontentEditable="true"ng-model="content">Edit<pre>model={cursor:backgroundbackground-color:#D0D0D0;margin-bottom:1em;padding:1em;運(yùn)行<!doctype<!doctype<htmlng-<divng-init="list=['Chrome','Safari','Firefox','IE']Numberformatting: |number}}arrayfiltering<inputng-{{list|filter:predicate|json運(yùn)行用的對象不存在，那么注入器就會讓實(shí)例工廠(nstancefactory)創(chuàng)建一個新的實(shí)例。////CreateavarmyModule=angular.module('myModule',//ConfigurethemyModule.factory('serviceA',function()return//insteadof{},putyourobjectcreation//createaninjectorandconfigureitfromvar$injector=//retrieveanobjectfromtheinjectorbyvarserviceA=//alwaystruebecauseofinstance$injector.get('serviceA')===////YouwritefunctionssuchasthisfunctiondoSomething(serviceA,serviceB)//dosomething//Angularprovidestheinjectorforyourvar$injector=//theold-schoolwayofgettingvarserviceA=varserviceB=//nowcallthe //thecoolwayofgetting//the$injectorwillsupplytheargumentstothefunction$injector$injector.invoke(doSomething);//Thisishowtheframeworkcallsyourng-ng- <!doctype<!doctype<htmlng- <script<divng-controller="ClockCtrl">Currenttimeis:{{time.now}} //Declarenewobjectcall//whichwillbeavailableforfactory('time',function($timeout)vartime=(functiontick()time.now=new$timeout(tick,return//Noticethatyoucansimplyaskfor//anditwillbeprovided.NoneedtolookforfunctionClockCtrl($scope,time)$scope.time=}運(yùn)行AngularJS命名空間為了防止意外名，AngularJS為可能：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼 TheMITLiense&&文檔CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾defms在:59說道：登錄以回指令的script.js部分有defms在:59說道：登錄以回指令的script.js部分有錯誤了index.htm部分評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南05 日ra ,-,_。你好可以選擇給指令加上前綴，比如“x-”，“data-”來讓它符合data-ng-data-ng-

,<spanmy-<spanmy-<spanclass="my-dir:<my-dir></my-<!--directive:my-direxp--<!doctype<!doctype<htmlng- <script<divng-o<inputng-model='name'>ng-<spanng:bind="name"></span><spanng_bind="name"></span><spanng-bind="name"></span>data-ng-bind="name"><spandata-ng-bind="name"></span>x-ng-bind="name"><spanx-ng-bind="name"></span>functionfunctionCtrl1($scope)$=}Endtoenditit('shouldshowoffbindings',function()expect(element('div[ng- span[ng-在編譯期間，編譯器會用＄iterpoate服務(wù)去檢查文本中是否嵌入了表達(dá)式。這個表達(dá)式會被當(dāng)成一個監(jiān)視器一樣，并且在作為＄digest循環(huán)中的一部分，它會自動更新。下面是一個替換式的例子：<img<imgsrc="img/{{username}}.jpg">o首先瀏覽器會用它的標(biāo)準(zhǔn)API將HTML解析成DOM。你需要認(rèn)清這一點(diǎn)，因為我們的模板必須是可被解析的HTML。這是AngulrJS和那些“以字符串為基礎(chǔ)而非以DOM元素為基礎(chǔ)的”模板系統(tǒng)的區(qū)別之處一旦所有的指令方被調(diào)用。指令的改DOM結(jié)構(gòu)，并且要負(fù)責(zé)生成一個link函數(shù)（后面會提到）。＄compie方法最后返回一個合并起來的函數(shù)，這是函數(shù)是每一個指令的compile函數(shù)返回的函數(shù)的集合。通過調(diào)用一步所說的函數(shù)來將模板與作用域起來。這會輪流調(diào)用每一個指令的函數(shù)，讓每一個指令都能對DOM ，和建立對作用域的的。這樣最后就形成了作用域的DOM的動態(tài)綁定。任何一個作用域的改變都會在DOM上體現(xiàn)出來。var＄compie=...;//injectedintoyourcodevarscope=...;varvarhtml='<divng-//Step1:parseHTMLintoDOMvar te=//Step2:compilethe varlinkFn= //Step3:linkthecompiledtemtewiththe編譯和分離的合理性分oo{{user}},youhavethese<ling-repeat="actionin令，ngRepeat是另一個指令。但個action構(gòu)造一個li。這以為著它先要保存一個“干凈”的li元素來用作克隆，然后等新的action插入進(jìn)來時，克隆一個li并插入到uli的話工作還沒完。他還需要編譯這個li才能把其中和插入li元素然后編譯它。但是要編譯每一個li的話，使用克隆會速度很漫總編譯函數(shù)－編譯函數(shù)在指令中是很少的，因為大部分指令都只是為了處理相應(yīng)的DM元素實(shí)例，而不是改變模板M元素?？紤]到性能問題，任何指令的實(shí)例見能被＾享的操作都應(yīng)該移到編譯函數(shù)中。函數(shù)－指令很少不帶有函數(shù)，函數(shù)可以讓指令對相應(yīng)克隆元素作用域中的內(nèi)容到DOM中。<!doctype<!doctype<htmlng- <script<script<divng-Dateformat:<inputng-model="format">Currenttimeis:<spanmy-current-functionfunctionCtrl2($scope)$scope.format='M/d/yyh:mm:ss} //Registerthe'myCurrentTime'directivefactory//Weinject$timeoutanddateFilterservicesincethefactorymethodis.directive('myCurrentTime',function($timeout,dateFilter)//returnthedirectivelinkfunction.(compilefunctionnotreturnfunction(scope,element,attrs)var //datetimeoutId;//timeoutId,sothatwecancancelthetime//usedtoupdatethefunction{element.text(dateFilter(newDate(),}//watchtheexpression,andupdatetheUIonscope.$watch(attrs.myCurrentTime,{format=value;//scheduleupdateinonefunction ater()//savethetimeoutIdfortimeoutId={updateTime();//updateupdaater();//scheduleanother},}//listenonDOMdestroy(removal)event,andcancelthenextUI//topreventupdatingtimeoftertheDOMelementwaselement.bind('$destroy',function()updaater();//kickofftheUIupdate}varvarmyModule= vardirectiveDefinitionObject{priority: te: teUrl:'directive.html', ce:false,transclude:restrict:'A',scope:false,compile:function ement,tAttrs,transclude)returnpre:functionpreLink(scope,iElement,iAttrs,controller){...},post:functionpostLink(scope,iElement,iAttrs,controller){...}link:functionpostLink(scope,iElement,iAttrs){...return大部分情況下你不需要控制這么多細(xì)節(jié)。一節(jié)里我們varvarmyModule= vardirectiveDefinitionObject=compile:functioncompile(ement,tAttrs)returnfunctionpostLink(scope,iElement,iAttrs){...}returnvarvarmyModule= returnfunctionpostLink(scope,iElement,iAttrs){...Factorymethod工廠DirectiveDefinitionObject指令定義對名稱name－當(dāng)前作用域的名稱，在是可選的

，優(yōu)先級priority－當(dāng)一個DOM上有多個指令時，有會需要指定指令執(zhí)行的順序。這個優(yōu)先級就是用來在執(zhí)行指令的compile函數(shù)前先排序的。高優(yōu)先級的先執(zhí)行。相同優(yōu)先級的指令順序沒有被指定誰先執(zhí)行。終端trminl－如果被設(shè)置為rue，那么該指令就會在同一個DOM的指令集和中最后被執(zhí)行。任何其他“ermnal”的指令也仍然會執(zhí)行，因為同級的指令順序是沒有被定義的。作用域so如果被定那么就會為當(dāng)前指令創(chuàng)建一個新的作用域。如果有多個在同一個DOM上的指令要求創(chuàng)建新作用域，那么只有一個新的會被創(chuàng)建。這一創(chuàng)建新作用域的規(guī)則不適用于模板的根節(jié)點(diǎn)，因為模板的根節(jié)點(diǎn)總是會得到一個新的作用域。｛｝對象哈希－那么一個新的“孤立的”作用域就會被創(chuàng)建。這個“孤立的”作用域區(qū)別于一般作用域的地方在于，它不會以原型繼承的方式直接繼承自父作用域。這對于創(chuàng)建可重用的組件是非常有用的，因為可重用的組件一般不應(yīng)該讀或?qū)懜缸饔糜虻臄?shù)據(jù)。性，這些本地作用域?qū)傩允菑母缸饔糜蛑醒苌鰜淼?。這些屬性主要用來分析模板的值。＠或＠attr－將本地作用域成員成員和DOM屬性綁定。綁定結(jié)果總是一個字符串，因{localName:'@myAttr'<widgetmy- oDOM的屬性就是字符串。如果DOM屬性的名字沒有{localName:'@myAttr'<widgetmy- o如和作用域?qū)ο?當(dāng)name值改變的時候，作用域中的LocalName也會改變。這個

是從父作用域中讀{localModel:'=myAttr'＝或＝expression(表達(dá)式)－在本地作用域?qū)傩院透缸饔糜驅(qū)傩蚤g建立一個雙向的綁定。如果沒有指定父作用域?qū)傩悦Q，那就和本地名稱一樣。比如<widgetmy-{localModel:'=myAttr'

和作用域?qū)?/p>

,本地會反映父作用域的值。localModel和parentModel的任方改變都會影&或&attr－提供了一種能在父作用域下執(zhí)行表達(dá)式的方法。如果沒有指定父作用域?qū)偈降暮瘮?shù)包裝。通常你可以通過這個表達(dá)式從本地作用域給父作用域傳值，操作方法是將本地變量名和值得對應(yīng)關(guān)系傳給這個表達(dá)式的包裝函數(shù)。比如說，這個表達(dá)式是的值

，那么你就可以用調(diào)

的方式指定控制器ontrllr－控制器的構(gòu)造對象。這個控制器函數(shù)是在預(yù)編譯階段被執(zhí)行的，并且它是共享的，其他指令可以通過它的名字得到（參考依賴屬性[equieaibue]）。這就使得指令間可以互相交流來擴(kuò)大自己的能力。會傳遞給這個函數(shù)的參數(shù)有：$scope－當(dāng)前元素關(guān)聯(lián)的$element－當(dāng)前元$attrs－當(dāng)前元素的屬性對象$transclude－模板功能前綁定到正確的模板作用域

ement－temteelement－指令所在的元素。對這個元素及其子元素進(jìn)行變形之類的操作是tAttrs－temteattributes－這個元素上所有指令的屬性，這些屬性都是在編譯函數(shù)里共享的，參考章節(jié)“屬性”。transclude－一個嵌入的函注意：如果模板被克隆了，那么模版實(shí)例和實(shí)例可能不是同一個對象。所以在編譯函數(shù)不要進(jìn)行任何DOM變形之外的操作。更重要的，DOM 或post-返回函數(shù)－等效于在編譯函數(shù)不存在時，使用配置對象屬性的函數(shù)或post-返回對象－返回一個通過屬性了函數(shù)的對象－使你能更具體的函數(shù)的執(zhí)行點(diǎn)。函數(shù)Linkingfunctionfunctionlink(scope,iElement,iAttrs,controller){...scope－指令需要的作用域

函數(shù)中對元素的子元素進(jìn)行iAtrs－nstanceattributes－實(shí)例屬性，一個標(biāo)?化的、所有在當(dāng)前元素上的屬性?表，這些所有函數(shù)間是共享的。參考“屬性”。controler－控制器實(shí)例，如果至少有一個指令定義了控制器，那么這個控制器就會被傳是指令間共享的，指令可以用它來相Pre-linking。Post-linking屬性TheAttributesobject屬性對象－作為參數(shù)傳遞給函數(shù)和編譯函數(shù)。這使得下列資涼可以被標(biāo)準(zhǔn)化的屬性名:因為指令的名稱，可以有很多種變形表示，，或bind，這個對象使得可以用標(biāo)準(zhǔn)的名稱獲取到相應(yīng)的指令間通信：所有指令間共享同一個屬性對象的實(shí)例，這使得指令可以通過這個屬性對象通信。支持替換式：屬性中若包含替換式，那么其他指令能夠獨(dú)到替換式的值。監(jiān)視替換式屬性：使用＄observe能監(jiān)視使用了替換式的屬性(比如的，也是為唯一的方法來獲取變量的值。因為在階段替換式還沒有被替換成值，所有變量此時是functionlinkingFn(scope,elm,attrs,ctrl)//gettheattributevalue////changetheattrs.$set('ngModel','new//observechangestointerpolatedattrs.$observe('ngModel',{console.log('ngModelhaschangedvalueto'+} ng-<dialogtitle=" o{{username}}."on-cancel="show= ng-<dialogtitle=" o{{username}}."on-cancel="show=on-ok="show=false;Bodygoeshere:{{username}}is點(diǎn)

body<divng-<divclass<divng-<divclass="body"ng-<div<buttonng-click="onOk()">Save ng-scope:{title:'=',onOk:onCancel:show:

//setuptitletoacceptdata-//createadelegateonOk//createadelegateonCancel孤立如果用戶忘了給

屬性賦值，那么模板就會綁定到父作用域的值上。這是一個比嵌入－嵌入的DOM可以獲取到組件的本地變量，這可能是的嵌入需要的用來做數(shù)據(jù)綁定的屬性被寫。在我們的例子里，組件

屬性覆寫了嵌入屬性被綁定任何東西。為了解決這個問題，需要在組件創(chuàng)建本地作用域前，讓嵌入的作用域成為子作用域transclude:scope:title:'bind',onOk:'expression',

//setuptitletoacceptdata-//createadelegateonOkonCancel:'expression',//createadelegateonCancelshow: //createagetter/setterfunctionfor：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼 TheMITLiense&&文檔CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾dark在作用:58說道：登錄以回如果被定義成那dark在作用:58說道：登錄以回如果被定義成那么就會為當(dāng)前指令創(chuàng)建一個新的—————作用如果被定義成true那么就會為當(dāng)前指令創(chuàng)建一個新的作用域評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南06{{表達(dá)式日ra{{表達(dá)式

3*10|AngularJS表達(dá)式與Javascript 屬性表達(dá)式：屬性表達(dá)式是對應(yīng)于當(dāng)前的作用域的，不像Javascript對應(yīng)的是全局window對象允許未定義值：執(zhí)行表達(dá)式時，AngularJS能夠允許undeined或者null，不像Jaacip會拋出一個異常。沒有控制結(jié)構(gòu)：你不能在AngularJS表達(dá)式中使用“條件判斷”、“循環(huán)”、“拋出異常”等控制結(jié)構(gòu)。過濾器(類似unix中的管道操作符)：你可以通過過濾器鏈來傳遞表達(dá)式的結(jié)果。例如將日期對象轉(zhuǎn)變成指定的閱讀友好的格式。達(dá)式中調(diào)用這個方法。如果你想在Javascrpt中執(zhí)行AngularJS表達(dá)式，你可以使用＄eval()方法。例<!doctype<!doctype<htmlng-端對端測試itit('shouldcalculateexpressioninbinding',{<!doctype<!doctype<htmlng- <script<divng-controller="Cntl2"class="expressions"><inputtype='text'ng-model="expr" ng-<ling-repeat="exprin[<ahref=""ng-click="removeExp($index)">X</a><tt>{{expr}}</tt>=><spanng-functionfunctionCntl2($scope)varexprs=$scope.exprs=$scope.expr=$scope.addExp={$scope.removeExp={exprs.splice(index,}端對端測試itit('shouldallowuserexpressiontesting',{element('.expressionsvarli=using('.expressionsul').repeater('li'); 屬性表用window作用域的話得用＄window來指向全局window對象。比如說，你使用window中定義的

<!doctype<!doctype<htmlng- <script<divclass="example2"ng-controller="Cntl1">Name:<inputng-model="name"type="text"/> ng-functionfunctionCntl1($window,$=$scope.greet=function()($window.mockWindow|| o'+}}端對端測試itit('shouldcalculateexpressioninbinding',function()varthis.addFutureAction('setmock',function($window,$,done)$window.mockWindow=alert:function(text){alertText=text;expect(this.addFuture('alerttext',function(done){done(null, o允許未定義的沒有流程控制結(jié)

也會返回undefnednamename| valuevalue|filter1|123123|你可能會好奇，這個＄的前綴有什么用？其實(shí)這只是一個標(biāo)記AngularJS專有腐性方法的符

但是考慮到我們以后可能會增加一個ength的方法（這會改變表達(dá)式的行為），同時你也想要自已有的對象上添加行為。使用＄做前綴的話，就能使得開發(fā)者的代碼和AnguarJS和諧共處了。：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼 TheMITLiense&&文檔CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾這篇文章中文版和英文版我反復(fù)看了很多遍了。這里這篇文章中文版和英文版我反復(fù)看了很多遍了。這里要特別注意表達(dá)式與普通JS語句的不Jerry.M在:37說道：登錄以回支持Node.js+AngularJs，關(guān)注。。評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南07 日ra表單控件(input,select,textarea合要建立安全 <!doctype<!doctype<htmlng- src="<script<divng-<formnovalidateclass="simple-Name:<inputtype="text"ng-model=""/><brE-mail:<inputtype=""ng- "/><brGender:<inputtype="radio"ng-model="user.gender"value="male"<inputtype="radio"ng-model="user.gender"value="female"/>female<br ng- ng-<pre>form={{user|<pre>master={{master|functionfunctionController($scope)$scope.master=$scope.update=function(user)$scope.master=$scope.reset=function()$scope.user=}

ng-vaid下面的例子演示了如何使用CSS來顯示表單的驗證結(jié)果。其中的和user.是必填<!doctype<!doctype<htmlng- <script<divng-<formnovalidateclass="css-form"><inputtype="text"ng-model=""required/><brE-mail:<input "ng- "required/><brGender:<inputtype="radio"ng-model="user.gender"value="male"<inputtype="radio"ng-model="user.gender"value="female"/>female<br ng- ng-<style.css-forminput.ng-invalid.ng-{background-color:}.css-forminput.ng-valid.ng-{background-color:}functionfunctionController($scope)$scope.master=$scope.update=function(user)$scope.master=$scope.reset=function()$scope.user=}一個表單就是一個域中。同樣的，一個表單控件也是一個

只有當(dāng)表單發(fā)生改變時，重置按鈕才會被思示出只有當(dāng)表單有改變并且改變的值都是合法的，保存按鈕才會被思示出來。能自定義user.和user.aree的錯誤信息。<!doctype<!doctype<htmlng- <script<divng-<formname="form"class="css-form"novalidate><inputtype="text"ng-model=""name="uName"required/><brE-<input "ng- " "required/><br<divng-<spanng-<spanng-.$dirty&& lus">ThisisnotaGender:<inputtype="radio"ng-model="user.gender"value="male"<input<inputtype="radio"ng-model="user.gender"value="female"/>female<br<inputtype="checkbox"ng-model="user.agree"name="userAgree"requiredIagree:<inputng-show="user.agree"type="text"ng-model="user.agreeSign"required/><br/><divng-show="!user.agree||!user.agreeSign">Pleaseagreeand ng- ng-<buttonng-ng- functionfunctionController($scope)$scope.master=$scope.update=function(user)$scope.master=$scope.reset=function()$scope.user=$scope.isUnchanged=function(user)returnangular.equals(user,}AngularJS實(shí)現(xiàn)了大部分常見的htmlS表單輸入元素(text,number,url,,radio,checkbox)，也實(shí)現(xiàn)了很多用于驗證的指令(requiredpatternminlengthmaxlengthmin,想要定義你自己的驗證器的話，可以通過在你自己的指令中添加一個驗證函數(shù)給gModel的控制器來實(shí)現(xiàn)。要想獲得控制器的，需要在指令中指定依賴，像下面的例子一樣。驗證函數(shù)可以寫在兩個地方。模型到視圖的更新中－只要綁定的模型改變了，NgModelConroller#$formaters數(shù)組中的函數(shù)就會被輪流調(diào)用，所以每一個函數(shù)都有機(jī)會對數(shù)據(jù)進(jìn)行格式化或者通過NgModelCoroller#$setVliy來改變表單的驗證狀態(tài)。視圖到模型的更新中－相同的，只要用戶與表單實(shí)現(xiàn)了就會，NgModelController#$setViewVaue就會被調(diào)用。這次是NgModelConroler#$prsers數(shù)組中的函數(shù)會被依次調(diào)用，每個函數(shù)都有機(jī)會來改變值或者通過NgModelConroller#$etVliiy來改變表單的驗證狀態(tài)。第一個要驗證的是輸入是否是整數(shù)。例如，1.23就不是符合驗證的值，因為它包含了分?jǐn)?shù)部分。注意，我們是將驗證數(shù)組中的項從頭取出，而不是壓入。這是因為我們要在輸入值被改變（格式化）前，先驗證輸入的。第二個指令是一個“智能孚點(diǎn)(mart－loa)”。它能把”.2或者”1,”都轉(zhuǎn)化為合法的孚點(diǎn)數(shù)”.”。注意，這里我們不能使用“數(shù)字輸入類型”，因為H支持TMLS的瀏覽器不允許用戶輸入像”,”這樣的非法值。<!doctype<!doctype<htmlng-app="form- <script<divng-<formname="form"class="css-form"Size(integer0-<inputtype="number"ng-model="size"name="size"min="0"max="10"integer/>{{size}}<br/><spanng-show="form.size.$eger">Thisisnotvalid<spanng-show="form.size.$error.min||TheThevaluemustbeinrange0toLength<inputtype="text"ng-model="length"name="length"smart-float{{length}}<br<spanng-show="form.length.$error.float">Thisisnotavalidfloatnumber!</span>varvarapp=angular.module('form-example1',varINTEGERREGEXP=/^\-?\d*$/;app.directive('integer',function(){returnrequire:link:function(scope,elm,attrs,{ctrl.$parsers.unshift(function(viewValue)if(INTEGERREGEXP.test(viewValue))//itisvalidctrl.$setValidity('integer',true);returnviewValue;}else//itisinvalid,returnundefined(nomodelctrl.$setValidity('integer',false);returnundefined;}}varFLOAT_REGEXP=/^\-?\d+((\.|\,)\d+)?$/;app.directive('smartFloat',function(){returnrequire:link:function(scope,elm,attrs,{ctrl.$parsers.unshift(function(viewValue)if{ return ce(',',}elsectrl.$setValidity('float',false);returnundefined;}}AglrJS已經(jīng)實(shí)現(xiàn)了所有基本的HTML表單控件(ipt,seect,textre)，對于大部分清況應(yīng)該已經(jīng)夠了。但是，你還是可以通過寫指令來實(shí)現(xiàn)你自己的表單控件。要和實(shí)現(xiàn)render方法。這個方法負(fù)責(zé)在數(shù)據(jù)傳遞給NgModelController#＄formatters后來渲染數(shù)據(jù)在用戶與控件交互并且模型需要被更新時，調(diào)用＄setViewValue方法。這通常是在DOM的成的。(查看＄compileProvider.directive來獲取信息)<!doctype<!doctype<htmlng-app="form- <script<divcontentEditable="true"ng-model="content"title="Clickto<pre>model=<style{cursor:pointer;background-color:#D0D0D0;angular.angular.module('form- returnrequire:link:function(scope,elm,attrs,ctrl)//view->elm.bind('blur',{scope.$apply(function(){//model->ctrl.$render={//loadinitvaluefrom}：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼 TheMITLiense&&文檔CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南08：i8n和日ra什么是i18n和，?寫為i18，指的是使產(chǎn)品?適應(yīng)不同語言和文化。本地化，?稱l10n，是指使產(chǎn) 的數(shù)據(jù)從應(yīng)用中出來。本地化意味著為這些 AngularJS目前對本地化和的支持程所有的AglarJS本地化組件都依賴于locale服務(wù)管理本地化規(guī)則(locaespeciicresets)。如果你想直接看例子，我們提供了一些來展示使用了豐富本地化規(guī)則的過濾器。你可以在什么是地區(qū) 成:語言代號和國家代號。比如，en-US,en-AU, 家代號。因為國家代號是可選的。所以像en,zh,andsk這樣的id也是合法的。查看ICU來獲取更預(yù)規(guī)catangularcatangular.jsi18n/angular-locale_de-ge.js>angular_de-則將地區(qū)載入到 <htmlng-<htmlng-<script src="i18n/angular-locale_de-兩種方貨幣戶在其他地方使用（比如說，中國的）你的應(yīng)用，它的瀏覽器會將地區(qū)指定成CN，'￥1000.00就會被顯示出來。這會迷惑你的用戶。譯文的時：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼 TheMITLiense&&文檔CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南09：IE瀏覽器兼日ra確保JSON字符串能被正常解析(E需要），你可以使用JSON2或者JSON3你不能使用自定義的元素，如者，

）， <!--[iflteIE.createElement('ng-.createElement('ng-.createElement('ng-//Optionallythesefor <!--[iflteIE.createElement('ng-.createElement('ng-.createElement('ng-//Optionallythesefor<![endif]---命名空間－你需要為你使用或者準(zhǔn)備使用的每一個自定義準(zhǔn)備一個命名空間.cretelemet(你的名)－自定義的創(chuàng)建－因為這只是老版本IE的一個問題，所以你要根據(jù)清況使用。對于每一個你沒有使用命名空間或者HTML中沒有定義的，你需要預(yù)先它彩色能使IE正常工作。如名是如沒

前綴開始的:這會被當(dāng)成是一個XML 名空間，并且必須使用來。

來創(chuàng)建如果你準(zhǔn)備使用css選擇器來對自定義添加樣式，那么你就必須先tag')來創(chuàng)建一下，不管有沒有XML命名空間用

(稱為my:tag或者my－tag都可以<mytag>some#+-#+-+-+-+-#text:some 的子元素。這個子元素包含文本”sete”#+-#+-+-+-+-#text:some+-一個自閉和的mytag。和自閉和<br/＞一樣。最后的關(guān)閉符/是可選的，醒是some解析成三個兄弟節(jié)點(diǎn)，而不是一個包含文本的節(jié)/一個純文字的節(jié)點(diǎn)。這本來應(yīng)該是上面mytag的子節(jié)點(diǎn)，而不/一個不合法的自閉和。因為名不允許含，所以說它是的。另外這個關(guān)閉不應(yīng)該是DOM的一部分，因為它是用來描述的結(jié)尾位置的：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼 TheMITLiense&&文檔CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾評論，您必須先登錄《AngularJS開發(fā)指南09：IE瀏覽器評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南10 日raDOM操設(shè)置好的和通知因為AnglrJS會處理大部分這些操作，所以開發(fā)者就能的專注在應(yīng)用邏輯上，更少地編寫那些重復(fù)性的、易錯的、低級的代碼。通用服務(wù)(用可替換的對象實(shí)現(xiàn)的通用的應(yīng)用操作)依賴注入（主要用于聚合服務(wù)）可擴(kuò)展的HTML編譯器(完全由Javacript編寫)易于測試你不會想在每一次頁面切換時都載入AglrJS。比如多頁應(yīng)用就常需要切換頁面。但是，如果你只是給已有的多頁應(yīng)用上加上一些AgarS提供的功能（比如使用AgrS模板的數(shù)據(jù)綁定功能）的話，那就有意義了。你可以按照后面的來將已有的應(yīng)用整合成單頁應(yīng)用。：：中文文檔AngularJS中文社區(qū)&&英文文檔AngularJS官網(wǎng)&&代碼TheMITLicense&&文檔 CCBY3.0rainer_H在開發(fā)指南分類，AnguarJS、rainer_H、開發(fā)指南。將本文加入收藏夾評論，您必須先登錄AngularJS中文社區(qū)&&AngularJS英文官網(wǎng)&&代 TheMITLicense&&文檔CCBY資資文社關(guān)登搜*上一下一篇AngularJS開發(fā)指南11 日ra啟動過程是式的，所以更容易靡在單元測試是不需要加載全部模塊的，因此這種方式有助于寫單元測試可以在特定清況的測試中增加額外的模塊，這些模塊能更改配置，能幫助進(jìn)行端對端的測試。第代碼可以打包成可重用的模塊。模塊可以以任何先后或者并行的順序加載（因為模塊的執(zhí)行本身是延遲的）ModuleAPI模塊注意我們是通過

中進(jìn)行指定，來實(shí)現(xiàn)使用myApp這個模塊啟動應(yīng)用<!doctype<!doctype<htmlng- <script{{'World'|greetvarvarmyAppModule=angular.module('myApp',//configurethe//inthisexamplewewillcreateagreetingsimpleAppModule.filter('greet',function()returnfunction(name)return o,'+name+推薦一個依賴以上模塊的應(yīng)用級模塊，它包含初始化代碼<!doctype<!doctype<htmlng- <script<divng-{{greetingangularangular.module('xmpl.service',[]).value('greeter',{salutatio

人人文庫> 全部分類> 教育資料 > 課件下載

溫馨提示

1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

angularjs詳細(xì)使用說明從零到高手

文檔簡介

溫馨提示

最新文檔

評論

相關(guān)文檔