這篇文章主要為大家展示了“Angular 1.x個人使用的示例分析”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“Angular 1.x個人使用的示例分析”這篇文章吧。
基本概念
1、依賴注入
依賴注入，在angular中到處可見，這里不會照本宣科，只以很直白的方式的簡單描述基本使用方式，以$scope注入為例。
創(chuàng)建一個controller，注入$scope,有三種寫法：
1)隱式注入
重慶分公司
重慶分公司
function HomeController($scope){};2)內(nèi)聯(lián)注入
app.controller('HomeController',['$scope',function($scope){ }])3)顯式注入
app.controller(‘HomeController',HomeController);
HomeController.$inject=[‘$scope'];
function HomeController($scope){
}注意：由于第一種注入方式，是通過對函數(shù)做toString操作，然后使用正則匹配出參數(shù)名稱，來實現(xiàn)注入，所以這種方式不能對代碼進行壓縮混淆處理。
2、directive
指令系統(tǒng)，我認(rèn)為是angular1.x版本中最強大也是最復(fù)雜的部分，angular作者本身做后端出身，所以在整個指令周期也符合語言處理過程：經(jīng)過編譯（compile函數(shù)，會返回link函數(shù)）、鏈接處理（link函數(shù)）。
1)指令最基本配置
app.directive(‘dire',function(){
return function(){
return {
template/templateUrl:'', //模版
scope:{} //為true或為對象表示隔離作用域
restrict 'ACEM'//使用方式
link:function(scope,ele,attrs,controllers){}
compile:function(ele,attr){return function(){}}//如果此函數(shù)存在，link函數(shù)會被忽略，因為compile函數(shù)會返回link函數(shù)
}
}
});2)關(guān)于綁定策略
獨立作用域父子作用域之間交換數(shù)據(jù)的方式，主要有三種（或說四種）
@綁定，指令屬性的值可以使用表達式，但是得出來的值一定是字符串；
&綁定，表示引用綁定，主要綁定父作用域中函數(shù)，實現(xiàn)關(guān)注點的注入
=綁定，表示雙向數(shù)據(jù)綁定
<綁定，表示單向綁定
注意：對于&綁定的使用，主要是為了實現(xiàn)子作用域到父作用域的傳遞，個人比較喜歡vue中父子交互的方式：props in，event out。所以這里我一般使用 scope.$emit(‘xxx',data),來實現(xiàn)子傳父。
3、component
component是1.5+新增的方法，主要為了往angular2+的過度更自然一些，相當(dāng)于指令restrict：'E'的簡化，類似于vue中的component，不建議操作dom，一般只用于渲染，建議構(gòu)建pure component。
4、controller
controller可以認(rèn)為是一個封裝程序邏輯的地方，這里和后端mvc中controller的作用類似，拿到modal，渲染模版，在angular中$scope是連接controller和view的橋梁，$scope是實現(xiàn)數(shù)據(jù)綁定的基礎(chǔ)，詳見文檔，這里不再贅述。
controller創(chuàng)建方式，主要分為靜態(tài)工廠方法注冊和動態(tài)注冊:
1)靜態(tài)注冊：
app.controller(‘HomeController',function(){})2)動態(tài)注冊：
$controllerProvider.register(“HomeController”,function(){})注意：動態(tài)注冊是實現(xiàn)按需加載的基礎(chǔ)，在項目結(jié)構(gòu)實戰(zhàn)模塊會基于requirejs 來演示怎么實現(xiàn)動態(tài)按需加載controller（當(dāng)然也可以使用oclazyload模塊實現(xiàn)按需加載）。
5、service
service一般是封裝通用代碼，所謂通用代碼一般是跨controller／directive等使用的代碼，所以經(jīng)常用來封裝ajax接口訪問、工具接口等。
service創(chuàng)建方式有三種：
1)、provider最原始的創(chuàng)建方式，可以注入到config中，加上provider后綴，有固定格式，必須返回$get函數(shù)
2)、factory是對provider的封裝，直接返回對象即可
3)、service是最簡單的創(chuàng)建方式，通過傳遞構(gòu)造函數(shù)來創(chuàng)建服務(wù)。
6、filter
過濾器主要實現(xiàn)對象的格式化
7、router
內(nèi)置路由模塊ngRoute，用的較少，主要因為無法實現(xiàn)復(fù)雜路由比如嵌套，多層等，當(dāng)然也可以結(jié)合ng-include實現(xiàn)類似效果，推薦使用第三方路由模塊ui-router，ui-router是基于state的一種路由框架，是使用最多的一種路由模式。
以上是“Angular 1.x個人使用的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司行業(yè)資訊頻道！
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)建站www.cdcxhl.com，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
