AngularJS初探(一)
AngularJS作為一個(gè)小而精的框架站欺,在UI設(shè)計(jì)和頁(yè)面邏輯交互上有他天然的優(yōu)勢(shì)姨夹,為Web程序員提供了一種快捷開(kāi)發(fā)的選項(xiàng),更何況還有g(shù)oogle這個(gè)干爹呢矾策!
作為一名AngularJS的初學(xué)者磷账,我于此記錄下我的學(xué)習(xí)過(guò)程。
要點(diǎn)
- 依賴(lài)注入
依賴(lài)注入從某種程度上說(shuō)是為了給控制器分級(jí)贾虽,是控制邏輯的注冊(cè)和分級(jí)逃糟,這樣,不同的module掌控了不同的service和factory榄鉴,他們之間可以通過(guò)繼承和覆蓋來(lái)完成一個(gè)層次上的分級(jí)功能履磨。 - directive
directive是集成自己的頁(yè)面元素和內(nèi)里的控裝邏輯,代碼復(fù)用的一種方便的方式,封裝和集成的完美體現(xiàn)
var app=angular.module('myApp',[]);
app.directive('footMenu',function(){
return {
restrict:'E',
transclude:true,
scope:{},
controller:'footCtrl',
templateUrl:'/footMenu.html'
};
});
上面展示了一個(gè)directive的定義過(guò)程
- Service庆尘,factory剃诅,value
MVC模型在業(yè)界已經(jīng)是大名鼎鼎,也有人說(shuō)AngularJS是MVMM模型驶忌,小生愚鈍矛辕,這兩個(gè)都不怎么熟。但是把界面和控制邏輯分離付魔,確實(shí)是非常偉大的舉動(dòng)聊品。我現(xiàn)在在做一個(gè)APP,把View提前寫(xiě)好几苍,再把交互邏輯加入翻屈,最后把與服務(wù)端交互的邏輯加入,是個(gè)看起來(lái)不錯(cuò)的開(kāi)發(fā)邏輯妻坝。讓我們?cè)倩貋?lái)看看controller吧伸眶。通過(guò)controller我們把一些控制邏輯與HTML的特定元素綁定惊窖,實(shí)現(xiàn)了不同控制邏輯的分離。
app.contrller('myCtrl',function($scope</span>,<span class="hljs-variable">$location){
$scope.redirect=function(destination){
$location.path(destination).replace();
};
});
<div ng-controller="myCtrl">
<button ng-click="redirect('/hh')">go</button>
</div>
上文定義了一個(gè)按鈕上的跳轉(zhuǎn)邏輯厘贼,這個(gè)controller起作用的就是div包裹的區(qū)域