JavaScript開發教程之angularjs總結

摸瞭三個月的angularjs,覺得有必要總結下它的一些關鍵點,有人說拿他試試水會發現它的強大,深入學習會遇到一些問題,可能是在加載優化方面的問題吧,畢竟一個項目龐大起來,所有的內容寄托於一個模塊,所有的控制器都會被先加載,故有使用require.js來按需加載。個人認為數據交互、路由和http是我比較關心的內容.

數據的交互,在表單上表現的尤為明顯,表單的驗證也是我喜歡的,可以省瞭很多事,期初我還沒發現這個好處,因為一些數據難以分出來出現在表單上面,我通過js 獲取在賦給表單,所以拋棄瞭angularjs的表單,它對與數據改變,是有它自己的監聽機制:

它的內置的事件指令會默認引起$apply調用$digest,如果不是它自身的,不會引起$apply,故一些事件需要$apply來啟動它的檢查,比如settimeout ,上圖就是為什麼頁面數據改動,控制器裡的數據就會變化,每個視圖的數據都安排瞭個watcher.這就是關鍵的地方。

對於路由本來是很簡單的事情,先把所有的路由配置好,就可以瞭,路由傳參數,在控制器裡接收就是瞭,但是它是單視圖的,不能發展子視圖,故有瞭ui-route.js幫助我們佈局多個插入入點,我的處理是,頁面裡延生頁面,就把它拋出,定義到外面跟它的父親視圖一個等級,在插入到ng-view裡,也是看別人寫的,也用這種方式,隻要路由定在外面,就跟其他頁面一樣的展現,相比angular2,它的路由就遜色瞭,ng2多瞭個路由守衛,這樣就可以處理很多權限的問題瞭。目前我還沒遇到1.x這方面的文章,可能接觸的少吧。

對於http,主要說的是數據的保存,這也是我一直困擾的,因為異步的加載,並不能保證數據得到,這樣就不能全局去使用數據瞭,$q服務的使用可以保證異步的執行,我也嘗試的寫瞭下,發現按刷新就沒數據瞭,可能我研究不夠吧,在服務裡保存,在全局作用域裡保存,都會出現這個問題。

我還發現瞭一個好東西http的攔截器 可以實現登入權限的驗證:

通過實現 request 方法攔截請求: 該方法會在 $http 發送請求道後臺之前執行,因此你可以修改配置或做其他的操作。該方法接收請求配置對象(request configuration object)作為參數,然後必須返回配置對象或者 promise 。如果返回無效的配置對象或者 promise 則會被拒絕,導致 $http 調用失敗。
通過實現 response 方法攔截響應: 該方法會在 $http 接收到從後臺過來的響應之後執行,因此你可以修改響應或做其他操作。該方法接收響應對象(response object)作為參數,然後必須返回響應對象或者 promise。響應對象包括瞭請求配置(request configuration),頭(headers),狀態(status)和從後臺過來的數據(data)。如果返回無效的響應對象或者 promise 會被拒絕,導致 $http 調用失敗。
通過實現 requestError 方法攔截請求異常: 有時候一個請求發送失敗或者被攔截器拒絕瞭。請求異常攔截器會俘獲那些被上一個請求攔截器中斷的請求。它可以用來恢復請求或者有時可以用來撤銷請求之前所做的配置,比如說關閉進度條,激活按鈕和輸入框什麼之類的。
通過實現 responseError 方法攔截響應異常: 有時候我們後臺調用失敗瞭。也有可能它被一個請求攔截器拒絕瞭,或者被上一個響應攔截器中斷瞭。在這種情況下,響應異常攔截器可以幫助我們恢復後臺調用。

關鍵還是講下,數據的繼承吧,父到子,子到父,全局作用域,

一:單例服務

service factory 等

二:廣播與事件、消息機制

$broadcast() ,$emit,$on()

三:子直接獲取父的數據

四:watch

這個好,也是上面說的可以監控數據,在實現分頁是不錯的,可以全局監控。

You May Also Like